Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Can't embed youtube video because of wrong attribute data-styles="{"width":"100%"}" #1393

Open
georgel-pop-lr opened this issue May 18, 2020 · 1 comment

Comments

@georgel-pop-lr
Copy link
Member

Do you want to request a feature or report a bug?
Report a bug.

What is the current behaviour?
When you try to embed a youtube video using the following code: "<div class="embed-responsive embed-responsive-16by9" data-embed-id="Qv1nRlct5a4" data-styles="{"width":"100%"}" style="width:100%"><iframe allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/Qv1nRlct5a4?rel=0" tabindex="0" width="560"></iframe>"
In the console an exception is being thrown"VM5500:1 Uncaught SyntaxError: Unexpected token w in JSON at position 1
at JSON.parse ()
at h.data (embedurl.js:413)
at h.g (ckeditor.js?browserId=other&languageId=en_US&b=7201&t=1588939054524:10)
at h.fire (ckeditor.js?browserId=other&languageId=en_US&b=7201&t=1588939054524:11)
at new h (plugin.js?t=K3FH:7)
at q.initOn (plugin.js?t=K3FH:55)
at q.initOnAll (plugin.js?t=K3FH:55)
at a. (plugin.js?t=K3FH:28)
at a.g (ckeditor.js?browserId=other&languageId=en_US&b=7201&t=1588939054524:10)
at a. (ckeditor.js?browserId=other&languageId=en_US&b=7201&t=1588939054524:11)"
This makes possible to save a wrong HTML code without any possibility of edit or remove it after it.

If the current behaviour is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem.

  1. Try to embed the following code: "<div class="embed-responsive embed-responsive-16by9" data-embed-id="Qv1nRlct5a4" data-styles="{"width":"100%"}" style="width:100%"><iframe allow="autoplay; encrypted-media" allowfullscreen="" frameborder="0" height="315" src="https://www.youtube.com/embed/Qv1nRlct5a4?rel=0" tabindex="0" width="560"></iframe>"
  2. An exception is thrown at "embedurl.js:413"
  3. You can save wrong styles text and without any possible way of editing or removing after it.

What is the expected behaviour?
You can save correct style text and with the possibility of editing or removing after it.

Which versions of alloy-editor, and which browser / OS are affected by this issue? Did this work in previous versions?
Affects version 2.11.6, affects all browsers. The bug begins when embedurl.js was created and added.

georgel-pop-lr added a commit to georgel-pop-lr/alloy-editor that referenced this issue May 18, 2020
…ption will be thrown and the code will stop working
georgel-pop-lr added a commit to georgel-pop-lr/alloy-editor that referenced this issue May 18, 2020
georgel-pop-lr added a commit to georgel-pop-lr/alloy-editor that referenced this issue May 18, 2020
wincent added a commit that referenced this issue May 19, 2020
fix: gracefully handle invalid JSON in data-style attribute (#1393)
@wincent
Copy link
Contributor

wincent commented May 19, 2020

Closed by: #1394

Released in: https://github.com/liferay/alloy-editor/releases/tag/v2.11.7

liferay-portal PR currently running against CI here: https://github.com/wincent/liferay-portal/pull/277

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants