The following example works great when rendered in the browser, where each Tab takes the label from its parent Pane component through context and adds it to its own label (REPL):
<script>
import Pane from './Pane.svelte';
import Tab from './Tab.svelte';
</script>
<Pane label="foo">
<Tab label="bar" />
<Tab label="baz" />
</Pane>
<!--
The following is rendered in the browser:
foo
foo/bar
foo/baz
-->
However, when this example is setup for SSR, the second Tab gets its context from its sibling Tab component rather than the parent Pane, like this repro illustrates:
<!--
The following is rendered on the server:
foo
foo/bar
foo/bar/baz
-->
A simpler test case:
<!-- Main.svelte -->
<script>
import Nested from './Nested.svelte';
import Leaf from './Leaf.svelte';
</script>
<Nested name='foo'>
<Nested name='bar'>
<Leaf/>
</Nested>
<Nested name='baz'>
<Leaf/>
</Nested>
</Nested>
<!-- Nested.svelte -->
<script context='module'>
export const ID = {};
</script>
<script>
export let name = '';
import { getContext, setContext } from 'svelte';
const parentName = getContext(ID);
setContext(ID, parentName ? parentName + '/' + name : name);
</script>
<slot></slot>
<!-- Leaf.svelte -->
<script>
import { getContext } from 'svelte';
import { ID } from './Nested.svelte';
const name = getContext(ID);
</script>
<div>{name}</div>
This should display
<div>foo/bar</div>
<div>foo/baz</div>
in all cases, but in SSR it currently displays
<div>foo/bar</div>
<div>foo/bar/baz</div>
current_component is only being set once, near the beginning of the main render function. It's never getting reset. So later on we're only even getting and setting the context from the same component.
Furthermore, the main render function is only used for the root component. Below that, each component's internal $$render function is used instead - and $$render does not update the current_component at all.
It looks like the $$render function itself needs some logic to update and reset the current_component. Something like the context: new Map(parent_component ? parent_component.$$.context : []) in the render function (which as far as I can tell isn't doing anything useful there, as there will never be a parent component at this point) needs to instead happen in $$render.