Comments (7)
@bensmithett It turned out solving for both cases was possible without the kind of ‘correctness’ concessions I thought would be necessary. I’m gonna wait for a sign off on the PR from Blake since he knows the tagged template stuff much better than I do, but I think it’s likely gonna work.
BTW, for html you can omit the /* syntax: html */ now if the name of the tag is html
.
from ecmascript-sublime.
For most template tag language modes, yes, we just delegate to existing definitions. But iirc, HTML may be one of the exceptional cases where we’re baking in a customized version, so this may be addressable.
The problem you’re running into appears to specifically be about attribute quotation marks. When we get past the interpolated segment, we’re still expecting opening quotation marks for an HTML attribute. The nature of the problem can be seen more clearly if we add quotation marks after — it resumes correctly, then:
A bit tangential, but maybe interesting: You mentioned that the lit-html extension for VSCode handles their absence okay. That surprised me slightly since lit-html discourages omitting the quotation marks, normally included because lit-html templates get parsed as real HTML by the browser. It’s a bit of a footgun in that context to omit them (it’s often fine, but may lead to avoidable surprises), so I haven’t noticed the issue myself as a lit-html user:
I will take a look at whether we’re baking in our own HTML def here or not and see if this is fixable from there.
from ecmascript-sublime.
I missed the second item in your screenshot on the first read, the use of interpolated segments in place of tag names. That’s a bit trickier since the assumption we need to make is weaker. That is, attr=${}
is a strong signal because we know the sequence must begin with an attribute value (even if it’s the empty string), and we couldn’t possibly be expected to recover if someone did things like attr=${"'foo'>"}
or attr="${ 'foo"' }
. In contrast, <${x}
is a fairly good indicator of a tag start, but there are many other possible continuations there in HTML, some of which even leave the < as chardata. I’ll look into it though.
from ecmascript-sublime.
@bathos amazing, thanks!
from ecmascript-sublime.
it is possible - i can do some black magic and have the embedded HTML syntax explicitly allow interpolated elements to act as unquoted attribute values. This opens up pandora's box a tiny bit since we would also want to consider all embedded contexts that should recover from interpolated elements, but i definitely see the value in making this work for markup languages. We wouldn't try to recover from the situations @bathos describes but we can at least cover all the cases you would want to interpolate a word, tag attribute or value.
from ecmascript-sublime.
Update just saw the two prev posts and the PR. Will check it out now.
from ecmascript-sublime.
Fixed in v2.1.2. Interpolation now supports tag names, attribute names, attribute values, and text node values.
from ecmascript-sublime.
Related Issues (20)
- a way of setting the default syntax for a template tag HOT 2
- Add support for graphql nested syntax HOT 5
- Comma background in destructuring assignments HOT 5
- Error loading colour scheme Packages/Ecmascript Syntax/excelsior.tmTheme HOT 4
- Update repository description HOT 3
- Add support for pug nested syntax HOT 5
- Build process does not work on Windows HOT 1
- Pipeline operator
- styled jsx has no css autocomplete and emmet does not work HOT 5
- Use a package setting to override the block comment directive syntax HOT 6
- AE identifiers prefixed with reserved words followed by `$`
- Digits after binary/octal HOT 4
- Async iterable inline literal object
- Associating Ecmascript with source.js ? HOT 4
- Update README ? HOT 1
- Symbols are not indexed in embedded syntax HOT 1
- Add DOM support for built-in color schemes HOT 5
- Turn off Safe Mode/Prefer Ecmascript standard mode. HOT 2
- LSP integration HOT 4
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from ecmascript-sublime.