Skip to content

$props is not defined thrown with dynamic type-attribute "workaround" #4368

Closed
@arggh

Description

@arggh

Prologue

With Svelte, it's somewhat cumbersome to create a typical <TextField> or <Input> -component with a dynamic attribute for type.

A workaround is required to get two-way bindings working, and the first one I found was the one being used at c0bra/svelma:

<script>
export let value;

const onInput = e => {
   value = e.target.value
   $$props.value = value
}
</script>

<input on:input={onInput}/>

Describe the bug
The pattern described above worked fine in Svelte 3.10.0 and earlier, but with 3.10.1 and later, an error is thrown on every input-event:

Uncaught ReferenceError: $props is not defined at HTMLInputElement.onInput

The value binding seems to work regardless, though.

To Reproduce

I took the <Input>-component from Svelma and tweaked it a tiny bit to get it running in the REPL:

(Broken with 3.18.1)
https://svelte.dev/repl/e84cf43befae4309927fad538078fd30?version=3.18.1

(Broken with 3.10.1)
https://svelte.dev/repl/e84cf43befae4309927fad538078fd30?version=3.10.1

(Working with 3.10.0)
https://svelte.dev/repl/e84cf43befae4309927fad538078fd30?version=3.10.0

Expected behavior
I'd expect not to get any errors, or a nicer, Sveltier way to achieve dynamic type-attributes.

Severity
Given how annoying it is to work around the dynamic type-attribute limitation, and then the workaround doesn't work, it definitely doubles the annoyance, if not triples?

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions