Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add a compile time error when passing arguments to regular HTML elements (e.g. <a @foo=) #1102

Merged
merged 1 commit into from
May 18, 2020
Merged

Add a compile time error when passing arguments to regular HTML elements (e.g. <a @foo=) #1102

merged 1 commit into from
May 18, 2020

Commits on May 18, 2020

  1. disallow @arguments on regular HTML nodes 

    Adds an error message in the compile phase to inform the developer that
`@arguments` are not allowed on HTML nodes. This can often come from
copy/pasting refactoring errors.

For example, given the following template:

```handlebars
<a href="https://emberjs.com" @OnClick={{action "foo"}}>Ember.js</a>
```

Before, the developer would get a vague error at runtime ([Example taken from
ember.js#18951](emberjs/ember.js#18951)):

```
jquery.js:3827 Uncaught TypeError: func is not a function
    at StatementCompilers.compile (VM32 ember.debug.js:43121)
    at compileStatements (VM32 ember.debug.js:44323)
    at maybeCompile (VM32 ember.debug.js:44312)
    at CompilableTemplateImpl.compile (VM32 ember.debug.js:44292)
    at Object.evaluate (VM32 ember.debug.js:51011)
    at AppendOpcodes.evaluate (VM32 ember.debug.js:49382)
    at LowLevelVM.evaluateSyscall (VM32 ember.debug.js:52284)
    at LowLevelVM.evaluateInner (VM32 ember.debug.js:52240)
    at LowLevelVM.evaluateOuter (VM32 ember.debug.js:52232)
    at JitVM.next (VM32 ember.debug.js:53175)
```

Now, they get an error message that looks like:

```
SyntaxError: ${attribute.name} is not a valid attribute name. @arguments
are only allowed on components, but the tag for this element
(\`${elementNode.tag}\`) is a regular, non-component HTML element. (location
line and column)
```

Given that there's no special behavior glimmer adds for `@arguments` on regular
HTML nodes, and it seems invalid to put `@` in attribute names in regular HTML
(validator.w3c.org gives ` Attribute @OnClick is not serializable as XML 1.0`
error message for the example template below), it seems helpful for the glimmer
compiler to fail at build time to prevent copy/paste errors and mistakes.

Fixes emberjs/ember.js#18951
    @fivetanley
    fivetanley committed May 18, 2020
    Configuration menu
    Copy the full SHA
    f265f28 View commit details
    Browse the repository at this point in the history