Cannot read private member from an object whose class did not declare it

[benoitdelorme]

Describe the bug I use Lenis in my Nuxt3-Lenis module and since I updated with the latest version of Lenis I have an error when I'm using lenis.start() and lenis.stop(). It worked with version 1.0.27

I tried to fix it but without much success.

start() {
  this.isStopped = false //  this.#isStopped = false
  this.reset()
}

stop() {
  this.isStopped = true //  this.#isStopped = true
  this.animate.stop()

  this.reset()
}

[clementroche]

You mean calling lenis.start() throws this error ? Can you provide a codesandbox ? It seems you're trying to change a private property of Lenis.

It might comes from how you use Lenis in your implementation since it works as expected here https://codesandbox.io/p/sandbox/small-cdn-yk9cqy?file=%2Fsrc%2FApp.js%3A8%2C16

[plcdnl]

i have the same problem. It happens when i call the functions start() and stop()

[plcdnl]

this is the sandbox: https://codesandbox.io/p/live/4825f9e6-107a-408c-8a57-aa5a1e22db81

[clementroche]

I can't access your codesandbox @plcdnl

[thiervoj]

I'm facing the same issue when calling start() and stop(). It seems to happen from Lenis v1.0.35, because v1.0.34 works fine on my end.

I think it comes from this commit, where private properties have been introduced.

According to the MDN Docs about Private Fields, I would suggest accessing these private class properties using this.#isStopped instead of this.isStopped for example : https://github.com/darkroomengineering/lenis/blob/main/packages/lenis/src/index.ts#L276

(I'm using Nuxt 3.10.2)

[clementroche]

Why is this happening only with nuxt ?

[thiervoj]

Good question, have you tested it in a vanilla js environment ?

[plcdnl]

Why is this happening only with nuxt ?

https://codesandbox.io/p/devbox/lenis-nuxt-bug-tfdzlp

here the sandbox. Sorry!

[clementroche]

https://codesandbox.io/p/sandbox/small-cdn-yk9cqy?file=%2Fsrc%2FApp.js%3A8%2C16 @thiervoj

[thiervoj]

I can't access your sandbox either @clementroche

[clementroche]

It seems like codesandbox make draft private by default now

here is @thiervoj : https://codesandbox.io/p/sandbox/small-cdn-yk9cqy?file=%2Fsrc%2FApp.js

[clementroche]

can you try outside of defineNuxtPlugin ?

[plcdnl]

can you try outside of defineNuxtPlugin ?

https://codesandbox.io/p/devbox/lenis-nuxt-bug-forked-9kkc6c?

[plcdnl]

Ok found, it happens with vue reactive/refs. With simple vars it works without problems

[clementroche]

ok that's not ideal anyway, thank you for your feedback, I must find a better way to handle it imo. Imma revert to previous way.

[plcdnl]

Thank you for your work!

[benoitdelorme]

Thank you!

[clementroche]

It's fixed in v1.0.37