Skip to content

mergeMode outer not working for multiple targets #780

@Napam

Description

@Napam

Bug Report

Hello, I encountered a bug with mergeMode outer in datastar.js-v1.0.0-beta.9.

I want to update multiple targets using one a single fragment from the backend. Basically, I start with the following HTML:

<main class="flex flex-col p-4 text-gray-200">
  <div>
    <button class="p-2 border" data-on-click="@get('/debug/test')" id="datastar5c84dy">Button</button>
  </div>
  <div>
    <div class="a">Hello</div>
    <div class="a">Hello</div>
  </div>
</main>

When I click on the button I receive the following from the response (I may have omitted some newlines here):

event: datastar-merge-fragments
retry: 1000
data: selector .a
data: mergeMode outer
data: fragments <div>Merged!</div>

And the resulting HTML is:

<main class="flex flex-col p-4 text-gray-200">
  <div>
    <button class="p-2 border" data-on-click="@get('/debug/test')" id="datastar5c84dy">Button</button>
  </div>
  <div>
    <div>Merged!</div>
  </div>
</main>

I expected that both the <div class="a">Hello</div> would turn into <div>Merged!</div>.

This works with merge mode morph though, but not outer. I have not checked the other merge modes.

Datastar Version

v1.0.0-beta.9

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions