Allow ID and data-* tags in TinyMCE

[PieterCappelle]

Allow ID-tag and data-* tag in HTML.

Fixed Issues (if relevant)

1. Cant put id or data attribute on <img> tags in the M2 wysiwyg. #10353

Manual testing scenarios

1. CMS Pages / Blocks
2. Add image
3. Edit HTML
4. Add id-tag or data-*="tag"
5. Error will throw up

Contribution checklist

• Pull request has a meaningful description of its purpose
• All commits are accompanied by meaningful commit messages
• All new or changed code is covered with unit/integration tests (if applicable)
• All automated tests passed successfully (all builds on Travis CI are green)

[osrecio]

Same issue solved in this PR #11025

I will test your solution ASAP.

[orlangur]

Why do you need ID attribute? It is forbidden for virtually any purpose, see http://devdocs.magento.com/guides/v2.2/coding-standards/code-standard-demarcation.html for details.

[PieterCappelle]

Why should ID be forbidden? If I want specifiek markup for one element.

[orlangur]

Because unique element today may become nonunique tomorrow. For example, #login on some pages occur more than once. Anyway, such discussion is out of scope for this PR, there is a standard which must be followed.

Please recreate branch from 2.2-develop so that it contains only one commit with data-* only and force push it to the same branch.

[magento-cicd2]

All committers have signed the CLA.

[PieterCappelle]

@orlangur Done.

[orlangur]

@PieterCappelle during testing we found out that even if we do not allow ID explicitly multiple scenarios exist where merchant is still able to add ID to an element. So, while it would be good to enforce demarcation standard, it is not that easy, we would have to change some TinyMCE internals.

Please force push current branch without last commit so that both id and data-* attributes are allowed (just like you did the fix initially).

[PieterCappelle]

@orlangur No problem, changed the code.

[orlangur]

Ah, ok, could do a revert on our side, just wanted a cleaner history :) Thanks for understanding 👍

[PieterCappelle]

Should be okay, sorry for delay. :)

[orlangur]

Ping @osrecio #11053 (comment) did this fix work for you after all? Last time there was a report from QA engineer that initial issue appears in some cases, didn't try it in action by myself yet.

[osrecio]

I don't try to myself yet, I will test this afternoon. I will test with 2.2-develop branch

[osrecio]

@orlangur don't works for me with id.

If I put: <img id="image-id" src="help.jpg" /> get the pop-up error with this error:

error: error in [unknown object].fireEvent(): event name: tinymceSaveContent error message: Failed to execute 'atob' on 'Window': The string to be decoded is not correctly encoded.

If I put: <img data-test="image-data" src="help.jpg" /> works fine.

[orlangur]

@osrecio thanks for checking!

@PieterCappelle could you please check the ID case?

[orlangur]

@PieterCappelle could you please check if this PR actually fixes mentioned issue? I didn't have a chance to check by myself yet but there are two independent persons which still observed "Failed to execute atob on Window".

[orlangur]

Closing for now as it seems like this change didn't fix initial issue completely, #11025 is another attempt of fix.

Thanks @PieterCappelle for your endeavour!