Issue #3131Opened November 11, 2020by Joshmamroud0 reactions

BUG: Paste as plain text into Text component adds <font /> wrapper to pasted text

Question

Version: 0.16.27

Are you able to reproduce the bug from the demo?

[] Yes [X] No

What is the expected behavior? Paste as plain text (text node) without Grapes JS wrapping pasted text in <font /> element.

What is the current behavior? When I paste text as plain text into an empty Text element, the editor wraps it in a <font /> element.

Before text is pasted Screenshot_1

After text is pasted (as plain text) Screenshot_2

The contents on my clipboard are plain text then I paste as plain text and it still gets wrapped in a <font /> element. This does not happen when there's already content in the Text component.

The text "I'm a Text Element. Double-click me and start typing." is not actually in the Text component but added using an :empty css rule.

Does anyone know why this is happening and how I can fix it?

Thank you, Josh

Answers (3)

JoshmamroudNovember 16, 20200 reactions

@artf do you know if this is this happening in the component or the RTE or somewhere else? Could you please point me in the right direction? Any help on this would be greatly appreciated. Thanks!

artfNovember 19, 20200 reactions

I can't reproduce it, but I see you're using a custom dm-text component, so that might be a reason?!

JoshmamroudNovember 19, 20200 reactions

@artf I don't believe so. Here is the configuration of the dm-text component type

{
  extend: 'text',
  model: {
    defaults: {
      name: 'Text',
      traits: [],
      editable: true,
      droppable: false,
      textable: true,
      style: {
        padding: '10px',
        width: '100%',
        height: 'auto',
      },
      stylable: [
        'background-color',
        'page-break-inside',

        'color',
        'text-align',
        'font-size',
        'font-family',
        'font-weight',
        'line-height',

        'border-width',
        'border-color',
        'border-style',

        'padding',
        'padding-top',
        'padding-right',
        'padding-bottom',
        'padding-left',

        'border-top-left-radius',
        'border-top-right-radius',
        'border-bottom-right-radius',
        'border-bottom-left-radius',
      ],
    },
  },
};

Do you see anything here that might be causing it?

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.