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

Attribute validation can break the app if plugins have mutated the DOM #158

Open
joshduck opened this issue Mar 27, 2020 · 1 comment
Open

Comments

@joshduck
Copy link

Inside _passAttributesAsProps() there is a check to ensure that the DOM node that is being updated does not have style, class or key attributes. This code will throw if any of these attributes are found.

This assumes that the application is the only code that is writing to the DOM. In practice, many browser extensions will also mutate the DOM. This will cause angular-react to throw and break the application.

This check should be, at most, a warning in production code.

Test case

Run this code in console.

Array.from(document.querySelectorAll('body *')).forEach(n => n.setAttribute('style', n.getAttribute('style') || 'zoom: 1'))

The next time that the Angular component is re-rendered, it will throw and break the application.

@joshduck
Copy link
Author

The extension "#1 Web & PDF Highlighter - LINER" for Chrome consistently crashes our application because it inserts style attributes into the DOM.

image

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

1 participant