solidjs
Transform Error when trailing space in Custom Component: Property value expected type of boolean but got undefined
Duplicates
- [X] I have searched the existing issues
Latest version
- [X] I have tested the latest version
Current behavior 😯
export default function SVGTEST() { let isUpperCase = false; const a = "ok"; return (<text>{isUpperCase ? a : a.toLocaleUpperCase()} </text>) }
An error occurs when there is a space between the closing curly brace } and the closing tag </text> at the end of the code, as in:
} </text>
However, the error disappears if the space is removed, as in:
}</text>
22:36:11 [vite] Internal server error: C:\Users\admin\Desktop\solid-project\src\components\typing\SVGTEST.tsx: Property value expected type of boolean but got undefined
Plugin: solid
File: C:/Users/admin/Desktop/solid-project/src/components/typing/SVGTEST.tsx
at Object.validate (C:\Users\admin\Desktop\solid-project\node_modules@babel\types\lib\definitions\utils.js:127:13)
at validateField (C:\Users\admin\Desktop\solid-project\node_modules@babel\types\lib\validators\validate.js:21:9)
at validate (C:\Users\admin\Desktop\solid-project\node_modules@babel\types\lib\validators\validate.js:15:3)
at validateNode (C:\Users\admin\Desktop\solid-project\node_modules@babel\types\lib\builders\validateNode.js:12:27)
at Object.booleanLiteral (C:\Users\admin\Desktop\solid-project\node_modules@babel\types\lib\builders\generated\index.js:450:36)
at C:\Users\admin\Desktop\solid-project\node_modules\babel-plugin-jsx-dom-expressions\index.js:1875:31
at Array.map (
Expected behavior 🤔
No response
Steps to reproduce 🕹
Steps:
1.Create a new SolidStart project.
2.Create a new file named svgtest.tsx.
3.Paste the following code into the svgtest.tsx file:
export default function SVGTEST() { let isUpperCase = false; const a = "ok"; return (<text>{isUpperCase ? a : a.toLocaleUpperCase()} </text>) }
4.Insert <SVGTEST></SVGTEST> into the index.tsx file.
5.Run index.tsx and an error occurs.
6.Change the code in svgtest.tsx to the following:
7.export default function SVGTEST() { let isUpperCase = false; const a = "ok"; return (<text>{isUpperCase ? a : a.toLocaleUpperCase()}</text>) }
The error disappears.
Context 🔦
No response
Your environment 🌎
windows 10 x64
bun 1.1.15
Steps:
1.Create a new SolidStart project. 2.Create a new file named svgtest.tsx. 3.Paste the following code into the svgtest.tsx file:
export default function SVGTEST() { let isUpperCase = false; const a = "ok"; return (<text>{isUpperCase ? a : a.toLocaleUpperCase()} </text>) }
4.Insert into the index.tsx file.
<SVGTEST></SVGTEST>
5.Run index.tsx and an error occurs. 6.Change the code in svgtest.tsx to the following: 7.The error disappears.
export default function SVGTEST() { let isUpperCase = false; const a = "ok"; return (<text>{isUpperCase ? a : a.toLocaleUpperCase()}</text>) }
This looks like a compiler error and has nothing to do with SolidStart. I can reproduce it in the playground: https://playground.solidjs.com/anonymous/6e22d979-a8f8-4548-b74f-1ebc68d67a4b
I will move this where it belongs
