Hacktoberfest 2026 : les issues que les mainteneurs ont marquées pour octobre, ouvertes et accessibles aux débutants. Parcourir les issues Hacktoberfest

JSX preserve mode generates invalid JSX for external component bindings

Ouverte
#8,047 1 commentaire 0 réactions 0 personnes assignées Voir sur GitHub

Personne n'a encore pris cette issue.

Évaluation

Difficulté
4/5
Temps estimé
3-5 jours
Accessibilité débutants
35/100
Type d'issue
Bug
Clarté
Plutôt claire
Activité
À l'abandon
Stack technique
javascript, ocaml
Domaine
compilers, web-dev

Piste de recherche

Commencez par la reproduction minimale liée, en utilisant rescript.json, Preact.res et Test.res, puis exécutez npx rescript build pour observer le Test.jsx généré. Suivez le traitement générique de JSX preserve du compilateur pour les liaisons de composants externes et ajoutez un test de régression couvrant la sortie invalide de la fonction fléchée ; c'est terminé lorsque du JSX valide correspondant à la forme attendue SomeLib.Head est produit.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Description

Thank you for filing! Check list:

  • Is it a bug? Usage questions should often be asked in the forum instead.
  • Concise, focused, friendly issue title & description.
  • A minimal, reproducible example.
  • OS and browser versions, if relevant.
  • Is it already fixed in master? Instructions

Summary

When using the generic JSX transform with "preserve": true, external component bindings generate invalid JSX syntax like <prim => Module.Component(prim)> instead of valid JSX.

ReScript Version

12.0.0

Minimal Reproduction

https://github.com/han-tyumi/rescript-jsx-preserve-bug

git clone https://github.com/han-tyumi/rescript-jsx-preserve-bug.git
cd rescript-jsx-preserve-bug
npm install
npx rescript build
cat Test.jsx
Files

rescript.json:

{
  "name": "preserve-bug",
  "sources": ["."],
  "package-specs": {
    "module": "esmodule",
    "in-source": true
  },
  "suffix": ".jsx",
  "jsx": {
    "module": "Preact",
    "preserve": true
  }
}

Preact.res (minimal bindings):

type element
type component<'props> = 'props => element

@module("preact/jsx-runtime")
external jsx: (component<'props>, 'props) => element = "jsx"

@module("preact/jsx-runtime")
external jsxs: (component<'props>, 'props) => element = "jsxs"

type fragmentProps = {children?: element}

@module("preact/jsx-runtime")
external jsxFragment: component<fragmentProps> = "Fragment"

type domProps = {children?: element}

module Elements = {
  external someElement: element => option<element> = "%identity"

  @module("preact/jsx-runtime")
  external jsx: (string, domProps) => element = "jsx"

  @module("preact/jsx-runtime")
  external jsxs: (string, domProps) => element = "jsxs"
}

Test.res:

// Component module pattern with external make
module Head = {
  type props = {children?: Preact.element}
  @module("some-lib")
  external make: props => Preact.element = "Head"
}

// Using the component
let test = <Head> <div /> </Head>

Expected Output

Valid JSX that can be processed by standard JSX transformers:

let test = <SomeLib.Head>
  <div />
</SomeLib.Head>;

Actual Output

Invalid JSX with arrow function syntax:

let test = <prim => SomeLib.Head(prim)>
  {Primitive_option.some(<div />)}
</prim => SomeLib.Head(prim)>;

Notes

  • Lowercase DOM elements work correctly in preserve mode (e.g., <div> stays as <div>)
  • Internal component modules (with ReScript-defined make functions) work correctly (e.g., <MyComponent.make>)
  • External component bindings produce the invalid arrow function syntax shown above

This prevents using preserve mode with frameworks like Preact/Fresh where you need to bind to external components.

Langage dominant
OCaml
Étoiles
7.5k
Forks
485
Merge moyen
1 j 2 h
PR mergées (30 j)
55

Guide de contribution

Ouvrir le guide de contribution

Par où commencer

  1. Lisez l'issue en entier, puis le guide de contribution du projet.
  2. Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
  3. Forkez le dépôt et travaillez sur une branche.
  4. Ouvrez une pull request qui référence le numéro de l'issue.

Autres issues de rescript-lang/rescript

Toutes les issues de rescript-lang/rescript

Issues similaires

Plus d'issues Compilers

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.