fix: allow imports from `svelte/legacy` in SSR (#13523)

Apps could crash if they import it in a way that is not treeshaken
pull/13526/head
Paolo Ricciuti 3 months ago committed by GitHub
parent 233bbecf55
commit db305a07f2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -0,0 +1,5 @@
---
'svelte': patch
---
fix: allow imports from `svelte/legacy` in SSR

@ -48,3 +48,19 @@ export function asClassComponent(component) {
export function run(fn) {
fn();
}
const noop = () => {};
// event stuff, no need to worry about it for SSR but needs to be there or it will crash
export {
noop as handlers,
noop as createBubbler,
noop as once,
noop as preventDefault,
noop as self,
noop as stopImmediatePropagation,
noop as stopPropagation,
noop as trusted,
noop as passive,
noop as nonpassive
};

@ -0,0 +1 @@
<!--[--><button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <button>click me</button> <!----> <div><button>click me</button> <button>click me</button> <button>click me</button></div><!--]-->

@ -0,0 +1,82 @@
<script>
import Button from "./Button.svelte"
import { createBubbler, handlers, preventDefault, stopPropagation, stopImmediatePropagation, self, trusted, once, passive, nonpassive } from 'svelte/legacy';
const bubble = createBubbler();
</script>
<button onclick={handlers(() => console.log('hi'), bubble('click'))}>click me</button>
<button onclick={handlers(function(){ console.log('hi') }, bubble('click'))}>click me</button>
<button onclick={handlers(() => console.log('before'), bubble('click'), () => console.log('after'))}
>click me</button
>
<button onclick={handlers(bubble('click'), foo)}>click me</button>
<button onclick={bubble('click')}>click me</button>
<button ondblclick={() => console.log('hi')}>click me</button>
<button ontoggle={bubble('toggle')}>click me</button>
<button oncustom-event={() => 'hi'}>click me</button>
<button oncustom-event-bubble={bubble('custom-event-bubble')}>click me</button>
<button onclick={preventDefault(() => (searching = true))}>click me</button>
<button onclick={preventDefault(() => '')}>click me</button>
<button onclick={stopPropagation(() => {})}>click me</button>
<button onclick={stopImmediatePropagation(() => '')}>click me</button>
<button onclickcapture={() => ''}>click me</button>
<button onclick={self(() => '')}>click me</button>
<button onclick={trusted(() => '')}>click me</button>
<button onclick={once(() => '')}>click me</button>
<button onclick={stopPropagation(preventDefault(() => ''))}>click me</button>
<button onclick={stopImmediatePropagation(stopPropagation(() => {}))}>click me</button>
<button onclick={self(stopImmediatePropagation(() => ''))}>click me</button>
<button onclick={trusted(self(() => ''))}>click me</button>
<button onclick={trusted(self(() => ''))}>click me</button>
<button onclick={once(trusted(() => ''))}>click me</button>
<button onclick={once(preventDefault(() => ''))}>click me</button>
<button use:passive={['click', () => bubble('click')]}>click me</button>
<button use:nonpassive={['click', () => bubble('click')]}>click me</button>
<button use:passive={['click', () => ()=>'']}>click me</button>
<button use:nonpassive={['click', () => ()=>'']}>click me</button>
<button use:passive={['click', () => foo]}>click me</button>
<button use:nonpassive={['click', () => foo]}>click me</button>
<button use:passive={['click', () => stopPropagation(()=>'')]}>click me</button>
<button use:nonpassive={['click', () => trusted(()=>'')]}>click me</button>
<button
use:passive={['click', () => ()=>'']}
onclick={handlers(bubble('click'), ()=>'')}
>click me</button>
<button
use:nonpassive={['click', () => ()=>'']}
onclick={handlers(bubble('click'), ()=>{
return 'multiline';
})}
>click me</button>
<button
onclick={handlers(bubble('click'), foo, ()=>'', once(trusted(preventDefault(()=>''))))}
onblur={handlers(foo, once(trusted(preventDefault(bubble('blur')))))}
>
click me
</button>
<Button on:click={() => 'leave untouched'} on:click>click me</Button>
<div>
<button
onclick={() => {
console.log('hi');
}}>click me</button
>
<button
onclick={preventDefault(() => {
console.log('hi');
})}>click me</button
>
<button onclick={preventDefault(() => (count += 1))}>click me</button>
</div>
Loading…
Cancel
Save