Skip to content

Private properties are inaccessible from the <template> region #21007

@NullVoxPopuli

Description

@NullVoxPopuli

🐞 Describe the Bug

Repro

I expect this to work:

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';
import { on } from '@ember/modifier';

export default class HelloWorld extends Component {
  @tracked count = 0;

  #increment = () => this.count += 1;

  <template>
    <p>You have clicked the button {{this.count}} times.</p>

    <button type="button" {{on "click" this.#increment}}>Click</button>
  </template>
}

but instead we get an implicit undefined replacement

when used wit the on modifier, you get this error:

can't access property "bind", userProvidedCallback is undefined

but if you use a property in the template, i.e.: {{this.#foo}}, undefined renders, and nothing tells you anything is wrong

🌍 Environment

  • Ember: 6.8.x

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions