Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Ampersand escapes in text content handled differently to JSX

Abierto
#76 11 comentarios 5 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
3/5
Tiempo estimado
1-2 días
Aptitud para principiantes
38/100
Tipo de issue
Error
Claridad
Bastante claro
Estado de actividad
Estancado
Stack tecnológico
javascript
Área
frontend

Línea de trabajo

Comienza con el punto de entrada de tagged template mostrado en la reproducción: htm.bind(h) y el contenido de texto dentro del template. Compara cómo se tokenizan los escapes literales de ampersand y las cadenas interpoladas, usando la salida de VNode proporcionada como referencia. Se considera terminado cuando las entidades de texto como \u0026lt; producen el texto decodificado correspondiente, de forma coherente con JSX, sin romper la interpolación.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

discussion help wanted

Reproduction

With the following code:

import htm from "https://unpkg.com/htm@2.1.1/dist/htm.mjs";
import { h } from "https://unpkg.com/preact@8.4.2/dist/preact.mjs";
const html = htm.bind(h);

console.log(html`<div>&lt;</div>`)

I get a VNode with .children = ["&lt;"] — i.e. what I mean to render as < gets rendered as &lt; instead.

Expected results

Testing this in JSX via say https://jsx.egoist.moe/?mode=vue, <div>&lt;</div> gets transformed into h("div", ["<"]); as I originally expected.

I haven't poked into how they are doing this… seems like something that ultimately relies on a lookup table.

Workaround

I am able to escape via string interpolation (e.g. ${'<'} instead of &lt;). Changing the last line in my sample code to:

// …

console.log(html`<div>${'<'}</div>`)

Results in a VNode with .children = ["<"] as I need. Is this the recommended style?

Lenguaje dominante
JavaScript
Estrellas
9k
Forks
181
Sin PR fusionados en 30 d

Guía de contribución

Abrir la guía de contribución

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de developit/htm

Todos los issues de developit/htm

Issues similares

Más issues de JavaScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.