BuilderIO/mitosis

BUG: Mitosis does not camelCase HTML attributes in React

Open

#526 opened on Jun 28, 2022

View on GitHub
 (7 comments) (0 reactions) (1 assignee)TypeScript (411 forks)batch import
coregood first issuereact

Repository metrics

Stars
 (9,803 stars)
PR merge metrics
 (Avg merge 1d 1h) (6 merged PRs in 30d)

Description

Scope

  • This impacts ALL Mitosis outputs
  • This only impacts specific generators/outputs (please list them here): React

Describe the bug Attributes like srcset are camelCased in React (possibly other frameworks? Not sure). However, Mitosis does not account for that

To Reproduce

A link to a https://mitosis.builder.io/ fiddle containing the bug: link

Expected behavior scrset should become srcSet in the React output. Same goes for all HTML attributes that are multi-word: https://reactjs.org/docs/dom-elements.html

Additional context

  • I am not sure what the comprehensive list of camelCased DOM elements is, but we can probably look at React's JSX types to determine what to do
  • I am also not sure if other frameworks do this camelCasing. We might need to do this elsewhere too

Contributor guide

Research direction
Identify all multi word HTML attributes and add camelCase mapping for React output. Refer to React JSX documentation for the list of camelCased attributes.
Tech stack
typescriptreact
Domain
compilers
Issue type
Bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
2
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
Active
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
Clear
Prerequisites
GitTypeScriptReact
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
75