Are Targets always in document order?

adrienpoly · April 5, 2018, 11:33am

In an app I will have plenty of targets of the exact same type within a list (some listItem).
Targets can be appended dynamically to the DOM anywhere in the list.

At some point I need to select all listItems, I need the result array of item to be exactly in the Document Order.

If I do a querySelectorAll the results are in the Document order : (source : https://www.w3.org/TR/selectors-api/#queryselectorall)
Can we be sure that if I do a this.listItemTargets as a selectpr my result will be also in Document Order?

javan · April 5, 2018, 12:45pm

Yes, they’ll always be in the same document order. Target elements are collected using querySelectorAll:

github.com

stimulusjs/stimulus/blob/6b15e0220b3661e016b8ed2ba9baad6aeeca4514/packages/@stimulus/core/src/scope.ts#L25-L29


findAllElements(selector: string): Element[] {
  const head = this.element.matches(selector) ? [this.element] : []
  const tail = this.filterElements(Array.from(this.element.querySelectorAll(selector)))
  return head.concat(tail)
}

adrienpoly · April 5, 2018, 1:24pm

Excellent, thanks for your prompt response

Topic		Replies	Views
Finding targets within another target	4	6322	December 16, 2022
Stimulus - How to select/filter a specific Target?	4	3314	May 18, 2022
How to add a target dynamically	0	2813	November 2, 2018
Why `this.fooTarget` instead of `this.targets.foo` (or `this.targets.get('foo')`)?	4	1665	April 4, 2018
Accessing Targets Conditionally	3	2460	December 21, 2018

Are Targets always in document order?

Related topics