Skip to content
This repository has been archived by the owner on Apr 12, 2024. It is now read-only.

fix(grunt-utils): insert the core CSS styles without using innerHTML #17014

Closed
wants to merge 2 commits into from

Conversation

koto
Copy link
Contributor

@koto koto commented Apr 16, 2020

Create style elements and modify their text content instead of using
innerHTML to create the whole <style> element with its content.
That way style insertion done at bootstrap time doesn't interfere with
Trusted Types restrictions in Chrome (https://bit.ly/trusted-types).

Remove the type attribute - text/css is default:
https://html.spec.whatwg.org/#update-a-style-block.

AngularJS is in LTS mode

We are no longer accepting changes that are not critical bug fixes into this project.
See https://blog.angular.io/stable-angularjs-and-long-term-support-7e077635ee9c for more detail.

Does this PR fix a regression since 1.7.0, a security flaw, or a problem caused by a new browser version?

Yes, Chrome launched Trusted Types in 83, and all AngularJS applications running on pages with require-trusted-types-for 'script' CSP directive cause CSP violation at bootstrap time.

What is the current behavior? (You can also link to an open issue here)

At bootstrap, AngularJS inserts the ngCloak styles using element.prepend with a payload that will trigger setting the style with innerHTML.

What is the new behavior (if this is a feature change)?

Changed the payload to create an element, and then insert the contents using as inner text instead.

Does this PR introduce a breaking change?

No, the same styles are inserted, in the same place and time.

Please check if the PR fulfills these requirements

  • The commit message follows our guidelines
  • [n/a] Fix/Feature: Docs have been added/updated

It's a grunt script change.

  • Fix/Feature: Tests have been added; existing tests pass

@koto koto force-pushed the addtyles branch 2 times, most recently from cfe0213 to 745bb51 Compare April 16, 2020 13:01
@petebacondarwin petebacondarwin added this to the 1.8.x milestone May 20, 2020
Copy link
Member

@gkalpak gkalpak left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Some minor comments, otherwise lgtm 👍
Thx, @koto!

lib/grunt/utils.js Outdated Show resolved Hide resolved
test/e2e/tests/sample.spec.js Outdated Show resolved Hide resolved
koto and others added 2 commits May 24, 2020 20:09
Create style elements and modify their text content instead of using
innerHTML to create the whole `<style>` element with its content.
That way style insertion done at bootstrap time doesn't interfere with
Trusted Types restrictions in Chrome (https://bit.ly/trusted-types).

Remove the type attribute - `text/css` is default:
https://html.spec.whatwg.org/#update-a-style-block.
@googlebot

This comment has been minimized.

@gkalpak

This comment has been minimized.

@googlebot

This comment has been minimized.

@gkalpak
Copy link
Member

gkalpak commented May 24, 2020

FYI, I rebased on master and added a commit to address my suggestions.

@gkalpak gkalpak closed this in 2518966 May 25, 2020
gkalpak pushed a commit that referenced this pull request May 25, 2020
Create style elements and modify their text content instead of using
innerHTML to create the whole `<style>` element with its content.
That way style insertion done at bootstrap time doesn't interfere with
Trusted Types restrictions in Chrome (https://bit.ly/trusted-types).

Remove the type attribute - `text/css` is default:
https://html.spec.whatwg.org/#update-a-style-block.

Closes #17014
@koto koto deleted the addtyles branch May 25, 2020 09:05
@koto
Copy link
Contributor Author

koto commented May 25, 2020

Thanks George!

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

Successfully merging this pull request may close these issues.

4 participants