"Could not find the rendering in the HTML loaded from server" when adding custom rendering to SXA

Question

Using Sitecore 8.2 along with SXA 1.2 rev. 161216, I am trying to add a simple SectionTitle (a title and a bit of HTML below it) rendering to the available renderings in SXA.

I followed a few tutorials, each of them presenting quite different approaches, still none worked. This is what I did,

Created the View

@using Sitecore.XA.Foundation.MarkupDecorator.Extensions
@using Sitecore.XA.Foundation.SitecoreExtensions.Extensions
@model myworkspace.Models.SectionTitle

<div @Html.Sxa().Component("section-title", Model.Attributes)>
  <div class="component-content text-green section-title">
      @Html.Sxa().Field("Title", Model.Item, Model.GetRenderingWebEditingParams())
      <span class="underline-shape-line"></span>
      <span class="underline-shape-disc"></span>
  </div>
</div>

Created the Model

public class SectionTitle : RenderingModelBase
{
    public SectionTitle() { }
    public string Title { get; set; }
}

Created the Controller

public class SectionTitleController : StandardController
{
    private readonly ISectionTitleRepository _repository;

    public SectionTitleController(ISectionTitleRepository repository)
    {
          _repository = repository;
    }

    protected override object GetModel()
    {
        return _repository.GetModel();
    }
}

Created a Repository class

(to be honest, I didn't fully understand why it is better than just ue CreateModel())

public interface ISectionTitleRepository: IModelRepository
{
}

public class SectionTitleRepository : ModelRepository, ISectionTitleRepository
{
    public override IRenderingModelBase GetModel()
    {
        SectionTitle model = new SectionTitle();
        FillBaseProperties(model);
        model.Title = GetTitle();
        return base.GetModel();
    }

    private string GetTitle()
    {
        return PageContext.Current[Templates.SectionTitle.Fields.Title];
    }
}

Created a Parameters Template

Called SectionTitle, inherits from IStyling and Standard Rendering Parameters

Created a Template

Called SectionTitle, with a section called Section and a field called Title (Rich Text)

Created a Controller Rendering

Controller: SectionTitle

Controller Action: Index

Parameters Template: The one created above

Datasource Location: query:$site/[@@name='Data']/[@@templatename='Text Folder']

Datasource Template: The template created above.

Still, when I try to add a new item in Experience Editor, I get

"Could not find the rendering in the HTML loaded from server"

I have tried lots of other configurations and always get this error, does someone have a hint ?

Answer 1

Looking into the logs, it appeared I had the same error as here but in french. I solved it adding a new constructor to the controller,

public SectionTitleController()
    {
        _repository = new SectionTitleRepository();
    }

I also miswrote the return value of GetModel(), I was returning base.GetModel() instead of model.

Answer 2

In my particular case this error occured not on a csutom rendering but on any rendering. The reason turned to be the solr service that served the website search indexes service was not running (any more).

https://localhost:8662/solr/#/ was not accessible (port number may vary on your solr instance for your project)

Starting the involved solr service in windows services solved my issue.

Maybe it can help someone