Description:

When using preact/signals-core and surreal's companion script css-scope-inline, I encountered an issue where when updating the element's textContent the script and style blocks get overwritten. This only happens when I include a style block in the element. Here is the code to reproduce the issue:

<script>
  let mySignal = signal("");
</script>

<div>
  sample text
  <script>
    {
      let textElement = me();
      effect(() => (textElement.textContent = mySignal.value));
    }
  </script>
  <style>
    me {
      background-color: red;
    }
  </style>
</div>

In this setup, when I change the value of the signal (mySignal.value = "some new text";), the script and style blocks get overwritten.

However, if I get the firstChild of the div, this issue does not occur:

<div>
  sample text
  <script>
    {
      let textElement = me().firstChild;
      effect(() => (textElement.textContent = mySignal.value));
    }
  </script>
  <style>
    me {
      background-color: red;
    }
  </style>
</div>

Steps to Reproduce:

1. Create a signal.
2. Use the signal value to update the textContent of an element inside a div that has a nested style block.
3. Observe that the script and style blocks within the div are overwritten when the signal's value changes.

Expected Behavior:

The script and style blocks of the div should not be overwritten when updating its textContent with the signal's value.

Actual Behavior:

The script and style blocks of the div element are overwritten when the signal's value is updated.

Additional Context:

When logging textElement.textContent both inside and outside the effect, it consistently shows "sample text" as expected.

To include preact/signals-core in your project you can use this html file which contains a script tag and the compiled preact/signals-core JS code:
https://github.com/eboody/app-template/blob/main/crates/services/web-server/src/templates/modules/signals.html