Unable to set whiteSpace style on NodeViewWrapper & NodeViewContent

[EvitanRelta]

What’s the bug you are facing?

Passing whiteSpace in the style prop of NodeViewWrapper and NodeViewContent elements doesn't work.

Rendered HTML:

Rendered HTML:

Which browser was this experienced in? Are any special extensions installed?

Nothing special.

How can we reproduce the bug on our side?

Attempt to pass whiteSpace: "pre" in the style prop of NodeViewContent & NodeViewWrapper in @tiptap/react.

For example:

And you'll see the white-space style on the rendered HTML elements won't be set to pre.

Can you provide a CodeSandbox?

https://codesandbox.io/s/intelligent-wildflower-wt6zb8?file=/src/Editor/CodeBlockComponent.test.js

The CodeSandbox example is the same as the React example from https://tiptap.dev/examples/syntax-highlighting, but with the style prop being declared on the NodeViewWrapper and NodeViewContent elements, as shown:

<NodeViewWrapper
  className="code-block"
  style={{
    color: "blue",
    whiteSpace: "pre"
  }}
>

<NodeViewContent
  as="code"
  style={{
    color: "red",
    whiteSpace: "pre"
  }}
/>

If you run the tests, it'll say that has the 2 color styles are set as red/blue, but not white-space: pre styling.

What did you expect to happen?

For it the whiteSpace style to reflect on the rendered HTML.

Anything to add? (optional)

No response

Did you update your dependencies?

• Yes, I’ve updated my dependencies to use the latest version of all packages.

Are you sponsoring us?

• Yes, I’m a sponsor. 💖