jsx-eslint/eslint-plugin-react

Rule proposal: enforce shape of dangerouslySetInnerHTML

Open

#711 geöffnet am 26. Juli 2016

Auf GitHub ansehen
 (2 Kommentare) (0 Reaktionen) (0 zugewiesene Personen)JavaScript (2.797 Forks)batch import
help wantednew rulequestion

Repository-Metriken

Stars
 (8.630 Stars)
PR-Merge-Metriken
 (Keine gemergten PRs in 30 T)

Beschreibung

React will issue a warning if you try to use dangerouslySetInnerHTML with a value of the wrong shape.

https://github.com/facebook/react/blob/85dcbf83/src/renderers/dom/shared/ReactDOMComponent.js#L173-L177

This should be easy enough to enforce for most cases with a linter rule.

Bad:

<div dangerouslySetInnerHTML={{ }} />

<div dangerouslySetInnerHTML={{ html: 'HTML' }} />

<div dangerouslySetInnerHTML={true} />

Good:

<div dangerouslySetInnerHTML={{ __html: 'HTML' }} />

Contributor Guide

Research-Richtung
Untersuche bestehende ESLint Regeln für React (z.B. jsx no literals), um das Muster zu verstehen, und erstelle dann eine neue Regel, die warnt, wenn dangerouslySetInnerHTML kein Objekt mit einem html Schlüssel ist.
Tech Stack
javascriptreact
Domain
frontendtooling
Issue Type
Funktion
SchwierigkeitGeschätzte Implementierungsschwierigkeit für neue Contributors, von 1 für sehr kleine Änderungen bis 5 für Expertenarbeit.
2
Geschätzte ZeitEin grober Zeitrahmen, um zu recherchieren, zu implementieren, zu testen und einen Pull Request vorzubereiten.
1-3 Stunden
AktivitätsstatusWie verfügbar das Issue gerade wirkt: frisch, aktiv, stale, blockiert oder wartet auf Maintainer-Input.
Aktiv
KlarheitWie klar das Issue die erwartete Änderung, Akzeptanzkriterien und den nächsten Schritt erklärt.
Klar
Voraussetzungen
JavaScriptReactESLint
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
80