emberjs / emberjs/ember-inspector

CSP warning for inline stylesheet

Open
#1,152 5 comments 1 reaction 0 assignees View on GitHub
Dominant language
JavaScript
Stars
969
Forks
292
PR merge metrics
No merged PRs in 30d

Description

**This isn't a big issue, the only drawback is the warning itself + styles aren't injected. Just wanted to note this issue here with details, in case others are curious. A simple workaround is to add `allow-inline` for `style-src` to the CSP policy when running in development.**

***

Content Security Policy (CSP) restrict what code running in the browser can do. For example, it may restrict JS loaded from certain origins, or forbid inline Javascript or CSS altogether.

For Chrome Extensions there are two types of CSP policies that come into play:

1. The policy defined by the extension itself, and
2. under some scenarios, the code that the extension is running in the webpage itself.

There are more details in [this guide](https://developer.chrome.com/extensions/contentSecurityPolicy#interactions), but in short if the content script is injecting JS that is later executed by the page, that code will be subjected to the pages CSP.

I'm guessing that may be what's going on here. Don't know the inner workings of this extension, so difficult for me to asses if this is an easy or difficult fix.

***

**Problem**

A CSP warning is emitted when opening the Ember Inspector , if `unsafe-inline` isn't permitted in the styles directive.

> Refused to apply inline style because it violates the following Content Security Policy directive [Chrome warning]

***

## Relevant Code

This is the line in Ember Inspector:
https://github.com/emberjs/ember-inspector/blob/47138779d4f6c559bda90a0e53df5838ac6da446/ember_debug/libs/view-inspection.js#L654

## Issue and Steps to Reproduce

- Install Ember Inspector extension
- Load the website running the ember app

## Your environment

Ember: 3.15.0
Ember Data: 3.15.1
Browser: Chrome **80**.0.3987.122

## Screenshots

![image](https://user-images.githubusercontent.com/122287/75552581-e2eae480-5a36-11ea-8663-faa214fc1db3.png)

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.