Option to *not* automatically include {} after defining an attribute on a HTML tag

[btakita]

I often would rather have double quotes instead of curly braces. In the case when the js code within the braces has spaces, double quotes need to be used anyways.

A more sensible default would be to have double quotes with curly braces inside. Or make it an option to change the default and/or have additional emmet-style sequences to have double quotes, curly braces, or double quoted curly braces.

[tomblachut]

In the case when the js code within the braces has spaces, double quotes need to be used anyways.

What do you mean? Svelte 3 supported that always, this plugin supports that since 0.10.0. Compatibility with other tools?

I agree that option to auto-insert "{}" could be preferred. For now let's see if this issue has wider community support.

[shirotech]

I agree to not auto-insert after defining an attribute, or auto-insert anything at all. It gets quite tiring having to remember backspace every time. It should however still auto close when braces or quotes when it is first opened.

[btakita]

As is, this this is an anti-feature, as I have to do 3 keystrokes to undo the auto braces. 90% of the time, I just want to have a plain old html attribute. And about 50% of the time I want the svelte curly braces, I want to use quotes.

That means, .9 * .5 = .045 or 4.5% of the time, the auto curly braces behavior is what I want. The other 95.5% of the time, I have to do 3 extra keystrokes to undo the behavior.

Note that 78.2% of the time, statistics are false.

[tomblachut]

And about 50% of the time I want the svelte curly braces, I want to use quotes.

@btakita you mean e.g. example="{something}" right? Why is that? I can't think of any other reason besides compatibility with other tools.

Anyway curly braces were ported from React JSX, I'm trying to - at first - match Svelte plugin to known IntelliJ behavior.
Now I'm thinking that directives should always insert braces because otherwise it's invalid (correct me if I'm wrong), attributes could default to quotes, and component props could default to braces because you usually compose components in loops, pass variables from parent, context or stores etc.

On other thing, I wonder if attrs could be partitioned into 2 groups, ones that have usually static values and ones that have usually dynamic values - but that's a little too clever.

[shirotech]

Trying to guess the intention of the developer I think would be too overkill.

Linking back to my post above, I think it should be up to the developer to decide rather than trying to guess.

e.g. when I key in = it should do nothing, when I key in { after = it should insert }. When I key in " after = it should insert ". Which effectively only auto-insert after it knows what the context of the attribute is. Hope this makes sense. I think most people would prefer 1 extra key then "click-backspace-backspace-etc-etc"

[tomblachut]

Yeah I understand what do you mean. That's pretty neat, yet I still think curly braces are more often preferred.

Something will be done about this, I'm not sure what yet. Some combination of changed defaults & intentions to wrap and unwrap {""} and "{}".

[shirotech]

Cool, whichever is decided sounds like it will have a better experience with current behaviour.

The ="{}" syntax is more for string interpolation, e.g. you can do something like this:

<script>
  const display = true ? 'block' : 'none';
<script>

<div style="display: {display}"></div>

Which is more readable, rather than:

<div style={`display: ${display}`}></div>

Which is still valid but looks cumbersome.

[tomblachut]

looks cumbersome

Agreed. Still it's unusual so I wouldn't take it into account when talking about default.

[btakita]

@tomblachut Svelte used to have a compile error when there were spaces in a {} block. It looks like this is no longer the behavior of Svelte. Given that, I'd rather there be no auto insert. Webstorm automatically closes a double quote or an open curly brace, which is 1 keystroke.

[tomblachut]

I'll (try to) release 0.12.0 this week. It won't insert {} for attributes, only for directives.

Brace matching is still broken - IDK why, so it will need to wait for future release.

[tomblachut]

Migrating from GH. Please open fresh issue on YouTrack. if something is still required, although with differentiation between attribute/directive I'm not sure if something still needs to be done here.