fix: add disconnectedCallback() lifecycle method to unmount map#97
fix: add disconnectedCallback() lifecycle method to unmount map#97jessicamcinchak merged 3 commits intomainfrom
Conversation
|
✔️ Deploy Preview for oslmap ready! 🔨 Explore the source changes: 7c277e5 🔍 Inspect the deploy log: https://app.netlify.com/sites/oslmap/deploys/61b870acb6649f0007950e4d 😎 Browse the preview: https://deploy-preview-97--oslmap.netlify.app |
src/my-map.ts
Outdated
| }); | ||
|
|
||
| this.map = map; | ||
| super.performUpdate(); |
There was a problem hiding this comment.
Would it help to just put this.map on the class instance as opposed to setting it as a reactive internal state with the @state decorator? The lit docs seem to not mention this as an option but I have a feeling the way this.map is used does not need any kind of reactivity (more like a useRef than a useState to borrow from React lingo).
There was a problem hiding this comment.
oh that's clever - i had definitely been following doc patterns and assuming every property should use a decorator, but this works (meaning, I can remove performUpdate() without prompting any lifecycle warnings)
| }; | ||
|
|
||
| // this is an internal event listener, so doesn't need to be removed later | ||
| // ref https://lit.dev/docs/components/lifecycle/#disconnectedcallback |
There was a problem hiding this comment.
Are you sure you get away with not having to clean this up if you didn't use their render() method with the html tagged template literal?
There was a problem hiding this comment.
mostly sure 🙃 the button & it's attached listener seem to be fully encapsulated in the map's shadow DOM on inspection, and the docs say "By default, a bubbling custom event fired inside shadow DOM will stop bubbling when it reaches the shadow root." so I think that means it can be considered "internal" & shouldn't prevent the map from unmounting?
https://lit.dev/docs/v1/components/events/#add-event-listeners-after-first-paint

fixes #96
🤞 this might/should fix planx bugs described here theopensystemslab/planx-new#704
https://lit.dev/docs/components/lifecycle/#content