question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

onDestroy doesn't work in Component Lib in ssr mode

See original GitHub issue

Describe the bug I am making a component lib. In one component (ssr mode) I was using onDestroy (imported from svelte) which called get_current_component().$$.on_destroy.push(fn); where it said on_destroy is undefined. I guess that is a bug?

If I’m abusing the use of generate ssr then that would be an explanation of undefined behavior.

To Reproduce Try creating a component lib (one output contains “generate”: “ssr”, while client output “hydratable”: true) and import the lib into your sapper project.

component lib’s package.json “main” points to the ssr lib while “browser” points to client output.

Expected behavior I don’t expect this error to occur!

Stacktraces If you have a stack trace to include, we recommend putting inside a <details> block for the sake of the thread’s readability:

Stack trace

Cannot read property{blah} TypeError: Cannot read property ‘push’ of undefined at onDestroy ({blah}/sapper/dev/server/index-d8e27d9f.js:754:42) at {blah}/sapper/dev/server/index-d8e27d9f.js:927:3 at Object.$$render ({blah}/sapper/dev/server/index-d8e27d9f.js:796:18) at {blah}/sapper/dev/server/index-d8e27d9f.js:1053:54 at Object.$$render ({blah}/sapper/dev/server/index-d8e27d9f.js:81:22) at Object.default ({blah}/sapper/dev/server/index-d8e27d9f.js:308:101) at {blah}/sapper/dev/server/index-d8e27d9f.js:252:38 at Object.$$render ({blah}/sapper/dev/server/index-d8e27d9f.js:81:22) at {blah}/sapper/dev/server/index-d8e27d9f.js:301:41 at $$render ({blah}/sapper/dev/server/index-d8e27d9f.js:81:22).

Information about your Svelte project:

  • Your browser and the version: (e.x. Chrome 52.1, Firefox 48.0, IE 10) Firefox 69
  • Your operating system: (e.x. OS X 10, Ubuntu Linux 19.10, Windows XP, etc) OS X 10
  • Svelte version (Please check you can reproduce the issue with the latest release!) 3.12.1
  • Whether your project uses Webpack or Rollup Rollup

Severity How severe an issue is this bug to you? Is this annoying, blocking some users, blocking an upgrade or blocking your usage of Svelte entirely? Not severe at all for my components for now. It blocks use of onDestroy on server side though

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:7 (1 by maintainers)

github_iconTop GitHub Comments

1reaction
david-pershousecommented, Oct 10, 2019

For future travelers. having a svelte: index.js where index.js exports your components by name

export { default as ExampleTextBox } from './ExampleTextBox.svelte';

in your component library is enough to keep sapper happy, as long as you ensure your component library is installed as a devDependency in package.json in your sapper app

0reactions
normanocommented, Oct 10, 2019

Thanks to some helpful people, think that this is not a bug. Should use bundler only at the top level project not at the component lib level since the bundler will include a copy of svelte at the component level.

Read more comments on GitHub >

github_iconTop Results From Across the Web

onDestroy not working when component target is removed
I'm having a problem where onDestroy is not called inside a Svelte component when the component's parent HTML element is removed.
Read more >
Docs • Svelte
Complete documentation for Svelte.
Read more >
Why your Angular App is not Working: 11 common Mistakes
1. Import required Angular Modules · 2. Don't use DOM references before they exist (@ViewChild) · 3. Don't manipulate the DOM directly -...
Read more >
NextUI + Next.js - Beautiful, fast and modern React UI Library
'use client'; at the top of your file. NextUI only works in client-side components. Next.js 12 and below.
Read more >
Svelte Lifecycle Method - onDestroy -- newline - Fullstack.io
For example, if you have a component that is wrapped within an {#if} block and it is currently rendered to the DOM, then...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found