bug: newly added slots are reordered when the container component's attribute set dynamically

yigityuce commented 2 months ago

Prerequisites

[X] I have read the Contributing Guidelines.
[X] I agree to follow the Code of Conduct.
[X] I have searched for existing issues that already report this problem, without success.

Stencil Version

4.21.0

Current Behavior

Requirements:

scoped components
no-shadow
experimentalSlotFixes: true
experimentalScopedSlotChanges: true

Steps:

container element (such as list) with default items in it
append() new items to that container element
click one of the items in the list
newly added items are randomly reordered

Rationale:

some flags are missing for the newly added elements
- for prepend patch: s-sh
- for append patch: s-sh and s-ol
therefore, on any action that triggers the relocation algorithm causes the reordering

prepend:

append:

Expected Behavior

Current:

Expected:

System Info

System: node 18.20.2
    Platform: darwin (23.6.0)
   CPU Model: Apple M3 Pro (12 cpus)
    Compiler: /Users/yigit.yuce/Documents/Projects/personal/yigityuce.github/stencil-v4-sc-new-child-relocation/node_modules/@stencil/core/compiler/stencil.js
       Build: 1724698030
     Stencil: 4.21.0 🐷
  TypeScript: 5.5.3
      Rollup: 2.56.3
      Parse5: 7.1.2
      jQuery: 4.0.0-pre
      Terser: 5.31.1

Steps to Reproduce

stated above

Code Reproduction URL

https://github.com/yigityuce/stencil-v4-sc-new-child-relocation

Additional Information

No response

tanner-reits commented 2 months ago

@yigityuce Thanks for the issue! I've confirmed the problem and I'll take a look at your PR first thing tomorrow!

yigityuce commented 2 months ago

closing since the PR is merged. thanks all! 🚀

christian-bromann commented 1 month ago

A fix for this has been released in Stencil v4.22.0 🎉

ionic-team / stencil

bug: newly added slots are reordered when the container component's attribute set dynamically #5969