RemirrorError: The content provided to the editor is not supported.

[francisco-alejandro]

Summary

I am wrapping the Remirror text editor inside a component in order to style it according to a style guide and functionality definitions. This component can be used by different applications and with different extensions. To achieve that, needed extensions are passed as props. I have tested with html stringHandler, and it works fine. However, using markdown as string handler I get this error:

RemirrorError: The content provided to the editor is not supported.

The string 'Initial Content' was added to the editor, but no `stringHandler` was added. Please provide a valid string handler which transforms your content to a `ProsemirrorNode` to prevent this error.

For more information visit https://remirror.io/docs/errors#rmr0021

This error description does not exist in the documentation.

Steps to reproduce

import "remirror/styles/all.css";
import { BoldExtension, MarkdownExtension } from "remirror/extensions";
import { Remirror, useRemirror } from "@remirror/react";

const Editor = ({ extensions }) => {
  const { manager, state } = useRemirror({
    extensions: () => extensions,
    content: "Initial Content",
    stringHandler: "markdown",
  });

  return (
    <div className="remirror-theme">
      <Remirror manager={manager} initialContent={state} />
    </div>
  );
};

const Home  = () => {
  const extensions = [new BoldExtension(), new MarkdownExtension()];

  return <Editor extensions={extensions} />;
};

This code raises the error if markdown stringHandler is used but it works with html stringHandler.

Expected results

No error raised

Actual results

Error rmr0021 is raised.

This approach works with html stringHandler and allow us to instantiate the extensions one and reuse them in other application text editor.

Now I can work using a function that return the extensions list, but I have to define all the extensions in each text editor rendered in the application.

Is it the desired behaviour ? In that case, is it necessary to improve the error message ? It seems not to be related at all, because stringHandler is already provided.

[schroeder-g]

@francisco-alejandro I encountered the same issue. The quick fix here is removing the initialContent key-value pair from the options you're passing into useRemirror. Could be mistaken but I don't think the markdown handler supports initialContent at all. I've since transitioned to HTML handler (converting to markdown on the backend).

[solarkraft]

Not sure if it helps, but I successfully use initialContent with Markdown like so: https://codesandbox.io/s/dazzling-pond-bc9xkg?file=/src/MdxEditor.tsx

A mistake raising this error I've made in the past was setting stringHandler: "markdown" without activating the MarkdownExtension.

Does your bold extension work? Could the issue be related to passing extensions as a function instead of an array?