Custom fields are not inserted with new ProseMirror editor

Bug
1

Hello!

We have an issue with events custom tags and the new WYSIWYG ProseMirror editor: custom fields filled from the event form are not present in the generated string. It still works as before with the markdown editor.

Steps to reproduce:

  1. Enable the Discourse Calendar plugin
  2. Add one custom field in plugin configuration
  3. Open a form for a new Post
  4. Select the ProseMirror editor
  5. Create an event with a value for the custom field (Options > Create Event)
  6. Validate the event
  7. Switch to Markdown editor

What is happening

The custom field is absent from the [event] tag.

What is expected

The custom field should be present in the [event] tag.

Notes

When doing the same but starting with the Markdown editor instead of ProseMirror, the custom field is present in the [event] tag.

2 Likes
2

I investigated a bit what was happening with the toolbarEvent when validating the new event: addText() method seems to receive in both cases the right markup:

[event start="..." status="..." timezone="..." end="..." cf_1="abcd"]\n[/event]
3

If that can help, here is the QUnit test to reproduce the issue:

// plugins/discourse-calendar/test/javascripts/acceptance/post-event-builder-custom-tags-test.js
import { click, find,visit, fillIn } from "@ember/test-helpers";
import { test} from "qunit";
import { acceptance } from "discourse/tests/helpers/qunit-helpers";
import selectKit from "discourse/tests/helpers/select-kit-helper";
import { i18n } from "discourse-i18n";

acceptance("Discourse Calendar - New event form with custom fields", function (needs) {
  needs.user({ admin: true, can_create_discourse_post_event: true });
  needs.settings({
    discourse_local_dates_enabled: true,
    calendar_enabled: true,
    discourse_post_event_enabled: true,
    discourse_post_event_allowed_on_groups: "",
    discourse_post_event_allowed_custom_fields: "my_custom_field",
    coopaname_integration_enabled: false,
  });

  test("filling the form with MD editor fills the custom fields", async function (assert) {
    await ensureEventTagHasFields(assert, 'md');
  });

  test("filling the form with WYSIWYG editor fills the custom fields", async function (assert) {
    await ensureEventTagHasFields(assert, 'wysiwyg');
  });
});

async function ensureEventTagHasFields(assert, editorType){
  await visit("/");
  await click('#create-topic');
  const categoryChooser = selectKit(".category-chooser");
  await categoryChooser.expand();
  await categoryChooser.selectRowByValue(2);

  await switchEditorTo(editorType);

  await click(".toolbar-menu__options-trigger");
  await click(`button[title='${i18n("discourse_post_event.builder_modal.attach")}']`);
  await fillIn('input.custom-field-input', 'some value')
  await click('.d-modal__footer > button');

  await switchEditorTo('md');

  const fields = ['start', 'status', 'timezone', 'myCustomField'];
  const content = await find(".d-editor-input").value;

  fields.forEach((field) => {
    assert.true(content.includes(`${field}="`), `${field} is present in event tag`);
  });
}

async function switchEditorTo(type){
  const editorSwitch = find('button.composer-toggle-switch');
  const isInMarkdown = editorSwitch.attributes['aria-checked'].value === 'false';
  if (isInMarkdown && type === 'wysiwyg' || !isInMarkdown && type === 'md') {
    await click(editorSwitch);
  }
}
4

Of course, remove this line in the test coopaname_integration_enabled: false, :upside_down_face:

5

I can’t find another plugin with the same feature, so it’s hard to find what’s wrong.

When validating the form, it calls this.args.model.toolbarEvent.addText() with the right text.

A few console.log™ lead me to : text-manipulation.js#addText() where this.convertFromMarkdown(text) gets called. It seems that the issue comes from here : there is a kind of schema enforced, and it does not contains the custom fields.

Still digging :shovel: …

6

The issue comes from the editor extension discourse-calendar/assets/javascripts/discourse/pre-initializers/rich-editor-extension.js : the list of attributes used by convertFromMarkdown() is defined in the EVENT_ATTRIBUTES constant. It works when adding the custom field to the list.

const EVENT_ATTRIBUTES = {
  // ...
  chatChannelId: { default: null },
  myCustomField: {default: null}
};

There is nothing about custom fields in this file; I have no idea on how to complete this constant with all the custom fields; the extension seems to get registered early in the process.

Any idea welcome, it makes the plugin unusable with the new editor that can’t be disabled, so we’re stuck with Discourse 3.4.

7

Custom fields are indeed unsupported on the rich editor for now. We’ll investigate the best path forward.

It can – if you’re an admin, you can set SiteSettings.rich_editor = false via the console, which is still available as a last resort in cases like this.

1 Like
8

Thanks for your reply, we’ll disable the editor for now.