Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unexpected handling of whitespace with respect to child text nodes #8

Open
shirakaba opened this issue Jan 30, 2021 · 0 comments
Open

Comments

@shirakaba
Copy link
Collaborator

Problem

When text content is specified in between HTML tags, I'd expected the Svelte runtime to to create a new text node for each line, and for each text node to have its text trimmed. I might be mistaken, though.

It's unclear what are the responsibilities of the Svelte runtime relative to the renderer (and NodeGUI itself), and so I'm cautious about performing any splitting and trimming on the renderer if it may lead to downstream problems upon state changes (e.g. text nodes subsequently being removed).

Svelte source

<script>
    import { onMount } from 'svelte';

    let win;

    onMount(() => {
        window.win = win;
        win.nativeView.show();

        return () => {
            clearInterval(timer);
            delete window.win;
        };
    });
</script>

<window bind:this={win}>
    <view id="container" style="background-color: 'cyan';">
        <text>
            Some text
            with actual
            children
        </text>
    </view>
</window>

<style>
    #container {
        align-items: 'center';
        justify-content: 'space-around';
    }
    #nice_button {
        font-weight: 900;
    }
</style>

Svelte runtime handling

The text content is treated as a single text node, rather than being split up based on white space:

image

This leads to:

image

Further reading

The first source of truth should be this specification: https://developer.mozilla.org/en-US/docs/Web/API/Document_Object_Model/Whitespace

We should also refer to how Svelte Native handles this.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant