aurelia / aurelia/framework

using typescript targeting ES2022 (or newer likely) silently breaks @observable and @bindable (partially)

Open
#1,010 7 comments 2 reactions 0 assignees View on GitHub
class fields
Dominant language
TypeScript
Stars
11.7k
Forks
608
PR merge metrics
No merged PRs in 30d

Description

**I'm submitting a bug report**
changing typescript from targeting ES2022 from ES2021 will silently break aurelia in some non-obvious ways. Any getters/setters done through prototyping are broken. Any getters/setters done afterworks succeed.

Simple view of the generated js and why its an issue: https://page.thepages.workers.dev/aurelia_cry

Simple repo from the default blank project: https://github.com/mitchcapper/aureliaV1_es2022_target_repo
and the single commit that differs from the empty project: [2e2b9c7d027574554a59a56834a8ee7c5b486ca1](
https://github.com/mitchcapper/aureliaV1_es2022_target_repo/commit/2e2b9c7d027574554a59a56834a8ee7c5b486ca1)

change it from es2022 to es2021 and it is fixed. Note you must restart the webpack engine after the change it will not auto-pickup that.

**Current behavior:**
When targetting ES2022 things like observable decorators are broken

**Expected/desired behavior:**
Same as with ES2021 where they work without issue

I don't know if this effects V2. I changed the targeting when trying to get an old aurelia project to work with more modern/node/webpack so tried to version up everything. As many things seem to work when this bug is present it took a good while to do the RCA.

Contributor guide

Open the contributing guide

Research direction

Start with the linked aureliaV1_es2022_target_repo and commit 2e2b9c7d027574554a59a56834a8ee7c5b486ca1. Reproduce the behavior with ES2022, restart webpack after changing the target to ES2021, and compare the generated JavaScript shown in the report. Verify the observable and bindable getter/setter behavior in both configurations; done means ES2022 behaves like ES2021.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.