Skip to content

Commit 257f8fe

Browse files
committed
refactor: use startsWith
[skip ci]
1 parent dbe2344 commit 257f8fe

File tree

1 file changed

+19
-22
lines changed

1 file changed

+19
-22
lines changed

src/scrollBehavior.ts

Lines changed: 19 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -44,27 +44,6 @@ export interface ScrollBehaviorHandler<T> {
4444
): Awaitable<ScrollPosition | false | void>
4545
}
4646

47-
/**
48-
* `id`s can accept pretty much any characters, including CSS combinators like >
49-
* or ~. It's still possible to retrieve elements using
50-
* `document.getElementById('~')` but it needs to be escaped when using
51-
* `document.querySelector('#\\~')` for it to be valid. The only requirements
52-
* for `id`s are them to be unique on the page and to not be empty (`id=""`).
53-
* Because of that, when passing an `id` selector, it shouldn't have any other
54-
* selector attached to it (like a class or an attribute) because it wouldn't
55-
* have any effect anyway. We are therefore considering any selector starting
56-
* with a `#` to be an `id` selector so we can directly use `getElementById`
57-
* instead of `querySelector`, allowing users to write simpler selectors like:
58-
* `#1-thing` or `#with~symbols` without having to manually escape them to valid
59-
* CSS selectors: `#\31 -thing` and `#with\\~symbols`.
60-
*
61-
* - More information about the topic can be found at
62-
* https://mathiasbynens.be/notes/html5-id-class.
63-
* - Practical example: https://mathiasbynens.be/demo/html5-id
64-
*/
65-
66-
const startsWithHashRE = /^#/
67-
6847
function getElementPosition(
6948
el: Element,
7049
offset: ScrollPositionCoordinates
@@ -88,7 +67,25 @@ export function scrollToPosition(position: ScrollPosition): void {
8867
let normalizedPosition: ScrollPositionCoordinates
8968

9069
if ('selector' in position) {
91-
const el = startsWithHashRE.test(position.selector)
70+
/**
71+
* `id`s can accept pretty much any characters, including CSS combinators like >
72+
* or ~. It's still possible to retrieve elements using
73+
* `document.getElementById('~')` but it needs to be escaped when using
74+
* `document.querySelector('#\\~')` for it to be valid. The only requirements
75+
* for `id`s are them to be unique on the page and to not be empty (`id=""`).
76+
* Because of that, when passing an `id` selector, it shouldn't have any other
77+
* selector attached to it (like a class or an attribute) because it wouldn't
78+
* have any effect anyway. We are therefore considering any selector starting
79+
* with a `#` to be an `id` selector so we can directly use `getElementById`
80+
* instead of `querySelector`, allowing users to write simpler selectors like:
81+
* `#1-thing` or `#with~symbols` without having to manually escape them to valid
82+
* CSS selectors: `#\31 -thing` and `#with\\~symbols`.
83+
*
84+
* - More information about the topic can be found at
85+
* https://mathiasbynens.be/notes/html5-id-class.
86+
* - Practical example: https://mathiasbynens.be/demo/html5-id
87+
*/
88+
const el = position.selector.startsWith('#')
9289
? document.getElementById(position.selector.slice(1))
9390
: document.querySelector(position.selector)
9491

0 commit comments

Comments
 (0)