1

I'm making a chrome extension, and ng-hide won't work because I don't have access to the angular styles. To get access to them I need to include the angular-csp.css file manually (as explained here: https://docs.angularjs.org/api/ng/directive/ngCsp).

However, I can't seem to get the angular-csp.css file to load correctly. Whenever my page loads, the console throws a "Uncaught SyntaxError: Unexpected token ILLEGAL" error.

As explained here: No visible cause for "Unexpected token ILLEGAL", the '@' symbol appears to be illegal, as is the unicode zero width-space. I tried taking the angular-csp.css code and retyping the code myself, but it still errors.

Here's the angular-csp.css file I'm using: https://code.angularjs.org/snapshot/angular-csp.css

and here's the text I manually retyped: 

[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak],
 .ng-cloak, .x-ng-cloak, .ng-hide:not(.ng-hide-animate) {
  display: none !important;
}
ng\:form {
  display: block;
}

Where is this magical breaking character?

Community
  • 1
  • 1
markain
  • 371
  • 5
  • 15

1 Answers1

2

After looking here, I switched my reference of the css file on my index.html page from:

<script src="angular_source/angular-csp.css"></script>

to

<link rel="stylesheet" href="angular_source/angular-csp.css" />

and it no longer errors.

I also realized that it no longer errors because script tags aren't used for requiring css files...

markain
  • 371
  • 5
  • 15