Semi-colon in component value breaks prop/value parsing.
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 17.6k
- Forks
- 4.4k
- PR merge metrics
- No merged PRs in 30d
Description
Description:
Having a string with a semicolon inside the value currently breaks parsing of attributes. Within the .update() step of the component, this.data is just a string, and any property accessor is left undefined.
If there is a proposed pattern that is decided on, I'd be more than happy to create a PR to make this available.
Three ideas I thought of:
esc()- I like the idea of
esc()here, as it fits the same pattern asurl(). It's also (in my opinion) very unlikely it will run into any issues/conflicts with data that people already put in component values.
esc()also allows the use-case where someone would want to write their own custom parser, and make use of both : and ; for delimiters.esc()can ignore any influential delimiters inside to protect the value for the user to do whatever they want with.
- I like the idea of
- using backticks (`) on either side of the string.
- Backticks, while cleaner, might have a chance of overlapping with values people already use, which would cause their backticks to be stripped out and potentially introduce a bug for them. There are some parsing rules that could be considered here (only parse backticks that are at the very start of a value, and at the very end before a semicolon).
- implement more context-aware parsing to be able to tell if a semicolon actually meant the end of a value.
- Regarding Idea 3, for the specific case of values containing only semicolons in them, this could work. Essentially adding more complex parsing to identify chunks that are valid properties vs invalid, then having semicolons only be picked up as delimiters if they are following by another prop/value pair. The downfall of this idea is that the user wouldn't be able to have a custom property parser with the same delimiters that a-frame uses (whether or not this is a problem I don't know, just listed here for clarity).
- A-Frame Version: 1.2.0
- Platform / Device: All
- Reproducible Code Snippet or URL: https://codepen.io/mordof/pen/zYoZpyZ (view console of codepen to see the issues showing up from the component update call).
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start by reproducing the parsing failure in the linked CodePen and inspect the component .update() step where this.data remains a string and property accessors are undefined. Before changing code, establish which of the three proposed parsing patterns A-Frame should support; done means semicolon-containing component values parse reliably without breaking existing delimiters.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100