Firefox space insertion behavior during typing

1

I’m seeing on odd issue with typing in spaces in ProseMirror that happens in Firefox but not in Chrome. Spaces are removed from text typed into the editor so that only non-space chars end up in the text. So if I type "hi there" I’ll get the following:

Firefox: "hithere" Chrome: "hi there"

Collapsing of multiple spaces into one space occurs during typing, but the cursor indicates that there’s one space present. When the first non-space char is typed the space disappears and only the non-space chars are left. This occurs before the call to replace() in the PM code, but I don’t know the code well enough to catch the space collapsing in the debugger.

I know it’s something that I’m doing because the behavior does not occur in the PM demo available on the website. I’m using the latest PM node modules with version 0.20 or 0.21 and including only the baseKeymap from the prosemirror-commands module. The problem occurs on both Firefox v. 50 and v. 53. It does not occur in Chrome v. 58. I’ve looked at the suggested topics in the forum, especially “Retaining spaces” from Mar '16, but the behavior that I see does not agree with what’s described in that post. Spaces are immediately collapsed while typing for me, but the post describes spaces as being retained during typing. The only config that I suspect might be involved is my schema. My schema defines the text node as follows:

text: { inline: true, text: true, toDOM(node) { return node.text } }

Any advice on how to configure ProseMirror to eliminate this behavior or how to catch the character insertion in the Firefox javascript debugger would be greatly appreciated.

1 Like
2

I noticed it too and opened an issue. https://github.com/ProseMirror/prosemirror/issues/651

3

I suspect it’s more my problem than ProseMirror’s because the demo editors that I’ve tried on the site (basic, lint) work properly in both Firefox and Chrome. Since I’m using only the standard keymap and a simple schema similar to the basic-schema that the basic demo uses I’m at a loss to understand what I’m doing to break PM.

4

Could it be that you’re not using the default prosemirror.css file, or overridden the white-space styling?

1 Like
5

That is indeed the problem. My stylesheet link was broken but it’s not obvious with ProseMirror embedded in the Odoo framework. Once I fixed the css link space insertion started working in Firefox just as it does in Chrome Sorry for yet another post for a trivial problem. Probably issue #651 is the same problem.

Once again I thank you profusely for your help. Many of my users will be on Firefox, so this was a show stopper issue for me.

1 Like