Writing getter for public class stateful variables transforms into duplicate getters

[theetrain]

Describe the bug

$state() can be used to define reactive class instance variables. This is generally very useful, though when writing a getter for public variables, there's a call stack error.

I later discovered this is called out in the docs:

The compiler transforms done and text into get / set methods on the class prototype referencing private fields. This means the properties are not enumerable.
— https://svelte.dev/docs/svelte/$state#Classes

I see from the JS output that a compiled $.get(this.#myvar) is necessary when returning the variable. Could the compiler detect when manually written getters are made, and perform this code transformation on our behalf?

Or instead, provide a warning when a get myvar() { return this.myvar } is written by the author, and provide education on the private variable getter/setter transformation.

Reproduction

1. Go to https://svelte.dev/playground/5eb453986f3f4615a312342b59bd297c?version=5.36.16
2. Open store.svelte.js
3. Observe transformed store has 2 getters

System Info

Svelte 5.36.16

Severity

annoyance

[7nik]

Isn't it the code wrong from the very beginning? Class cannot have a field and getter/setter with the same name - they conflict.
Edit: How this black magic works and does not confuse anybody?
Edit2: So, the getter goes to the prototype, while the field is on the instance and shadows the getter. So, I still think the code is "wrong" to begin with and this approach doesn't make sense.

[theetrain]

So, I still think the code is "wrong" to begin with and this approach doesn't make sense.

I think I agree with you. It turns out I misunderstood the class concept. For example:

class Example {
  name = 'Person'

  get name() { return 'Hi ' + this.name }
}

const test = new Example()
test.name // yields 'Person', and not 'Hi Person'

Writing a getter for a public class variable does not work the way I expected since it's already duplicative. We can close this issue or perhaps show a warning to the developer when they attempt this; the argument for providing a warning is doing this pattern in Svelte would cause a "call stack size exceeded" error whereas this would fall back to returning the instance variable in plain JS, and there's an opportunity to link to the docs. I'm happy with either outcome.