ionic-team / ionic-team/ionicons

bug: CSP - Refused to apply inline style because it violates the following Content Security Policy directive: "style-src-elem …"

Offen
#1,218 2 Kommentare 2 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
help wanted
Vorherrschende Sprache
TypeScript
Sterne
18.2k
Forks
2.1k
PR-Merge-Kennzahlen
Keine gemergten PRs in 30 T.

Beschreibung

### Current Behavior

When you enable at least the following CSP header
```
Content-Security-Policy = 'default-src https://cdnjs.cloudflare.com/ajax/libs; style-src-elem https://cdnjs.cloudflare.com/ajax/libs'
```
browsers will refuse to apply inline styles (rightfully).

The exact error message:
```
p-ea7bbed1.system.js:1 Refused to apply inline style because it violates the following Content Security Policy directive: "style-src-elem localhost […]". Either the 'unsafe-inline' keyword, a hash ('sha256-NBfyYgxoWTkJ9SyHWLNVIq8UkKGvsaGPAaGmNMpVMSA='), or a nonce ('nonce-...') is required to enable inline execution.
```

Problematic code (in the last line):
```js
{
$.innerHTML = n + v;
$.setAttribute("data-styles", "");
l.insertBefore($, o ? o.nextSibling : l.firstChild)
}
```
File: https://cdnjs.cloudflare.com/ajax/libs/ionicons/7.1.0/ionicons/p-ea7bbed1.system.js

### Expected Behavior

Styles applied normally from JS and not inline.

### Steps to Reproduce

Turn on the mentioned CSP headers.

### Code Reproduction URL

_No response_

### Additional Information

_No response_

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Start by reproducing the issue with the stated Content-Security-Policy header and inspect ionicons/p-ea7bbed1.system.js, especially the final inline-style insertion shown in the report. Trace that generated code back to its TypeScript source; done means styles still apply normally without requiring inline-style execution under the CSP.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
javascript, typescript
Bereich
frontend, security
Issue-Typ
Bug
Schwierigkeit
4/5
Geschätzter Aufwand
3-5 Tage
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.