@treelocator/runtime 0.3.0 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +32 -0
- package/.turbo/turbo-dev.log +32 -0
- package/.turbo/turbo-test.log +14 -0
- package/.turbo/turbo-ts.log +4 -0
- package/LICENSE +22 -0
- package/dist/adapters/react/getAllParentsElementsAndRootComponent.d.ts +1 -1
- package/dist/adapters/react/getAllParentsElementsAndRootComponent.js +6 -4
- package/dist/adapters/react/getAllWrappingParents.js +1 -1
- package/dist/adapters/react/reactAdapter.js +5 -1
- package/package.json +2 -2
- package/src/adapters/react/getAllParentsElementsAndRootComponent.ts +7 -7
- package/src/adapters/react/getAllWrappingParents.ts +1 -1
- package/src/adapters/react/reactAdapter.ts +5 -2
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
|
|
2
|
+
> @treelocator/runtime@0.3.1 build /Users/wende/projects/treelocatorjs/packages/runtime
|
|
3
|
+
> concurrently pnpm:build:*
|
|
4
|
+
|
|
5
|
+
[wrapImage]
|
|
6
|
+
[wrapImage] > @treelocator/runtime@0.3.1 build:wrapImage /Users/wende/projects/treelocatorjs/packages/runtime
|
|
7
|
+
[wrapImage] > node ./scripts/wrapImage.js
|
|
8
|
+
[wrapImage]
|
|
9
|
+
[ts]
|
|
10
|
+
[ts] > @treelocator/runtime@0.3.1 build:ts /Users/wende/projects/treelocatorjs/packages/runtime
|
|
11
|
+
[ts] > tsc --declaration --emitDeclarationOnly --noEmit false --outDir dist
|
|
12
|
+
[ts]
|
|
13
|
+
[babel]
|
|
14
|
+
[babel] > @treelocator/runtime@0.3.1 build:babel /Users/wende/projects/treelocatorjs/packages/runtime
|
|
15
|
+
[babel] > babel src --out-dir dist --extensions .js,.jsx,.ts,.tsx
|
|
16
|
+
[babel]
|
|
17
|
+
[tailwind]
|
|
18
|
+
[tailwind] > @treelocator/runtime@0.3.1 build:tailwind /Users/wende/projects/treelocatorjs/packages/runtime
|
|
19
|
+
[tailwind] > tailwindcss -i ./src/main.css -o ./dist/output.css
|
|
20
|
+
[tailwind]
|
|
21
|
+
[wrapImage] Tree icon file generated
|
|
22
|
+
[wrapImage] pnpm run build:wrapImage exited with code 0
|
|
23
|
+
[babel] [baseline-browser-mapping] The data in this module is over two months old. To ensure accurate Baseline data, please update: `npm i baseline-browser-mapping@latest -D`
|
|
24
|
+
[tailwind] [baseline-browser-mapping] The data in this module is over two months old. To ensure accurate Baseline data, please update: `npm i baseline-browser-mapping@latest -D`
|
|
25
|
+
[tailwind]
|
|
26
|
+
[tailwind] Rebuilding...
|
|
27
|
+
[tailwind]
|
|
28
|
+
[tailwind] Done in 175ms.
|
|
29
|
+
[tailwind] pnpm run build:tailwind exited with code 0
|
|
30
|
+
[babel] Successfully compiled 82 files with Babel (602ms).
|
|
31
|
+
[babel] pnpm run build:babel exited with code 0
|
|
32
|
+
[ts] pnpm run build:ts exited with code 0
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
|
|
2
|
+
> @treelocator/runtime@0.1.8 dev /Users/wende/projects/locatorjs/packages/runtime
|
|
3
|
+
> concurrently pnpm:dev:*
|
|
4
|
+
|
|
5
|
+
[babel]
|
|
6
|
+
[babel] > @treelocator/runtime@0.1.8 dev:babel /Users/wende/projects/locatorjs/packages/runtime
|
|
7
|
+
[babel] > babel src --watch --out-dir dist --extensions .js,.jsx,.ts,.tsx
|
|
8
|
+
[babel]
|
|
9
|
+
[wrapImage]
|
|
10
|
+
[wrapImage] > @treelocator/runtime@0.1.8 dev:wrapImage /Users/wende/projects/locatorjs/packages/runtime
|
|
11
|
+
[wrapImage] > WATCH=true node ./scripts/wrapImage.js
|
|
12
|
+
[wrapImage]
|
|
13
|
+
[ts]
|
|
14
|
+
[ts] > @treelocator/runtime@0.1.8 dev:ts /Users/wende/projects/locatorjs/packages/runtime
|
|
15
|
+
[ts] > tsc --watch --declaration --emitDeclarationOnly --noEmit false --outDir dist --preserveWatchOutput
|
|
16
|
+
[ts]
|
|
17
|
+
[wrapCSS]
|
|
18
|
+
[wrapCSS] > @treelocator/runtime@0.1.8 dev:wrapCSS /Users/wende/projects/locatorjs/packages/runtime
|
|
19
|
+
[wrapCSS] > WATCH=true node ./scripts/wrapCSS.js
|
|
20
|
+
[wrapCSS]
|
|
21
|
+
[tailwind]
|
|
22
|
+
[tailwind] > @treelocator/runtime@0.1.8 dev:tailwind /Users/wende/projects/locatorjs/packages/runtime
|
|
23
|
+
[tailwind] > tailwindcss -i ./src/main.css -o ./dist/output.css --watch
|
|
24
|
+
[tailwind]
|
|
25
|
+
[tailwind] ELIFECYCLE Command failed.
|
|
26
|
+
[ts] ELIFECYCLE Command failed.
|
|
27
|
+
[wrapImage] ELIFECYCLE Command failed.
|
|
28
|
+
[wrapCSS] ELIFECYCLE Command failed.
|
|
29
|
+
[babel] ELIFECYCLE Command failed.
|
|
30
|
+
[babel] pnpm run dev:babel exited with code SIGINT
|
|
31
|
+
[wrapCSS] pnpm run dev:wrapCSS exited with code SIGINT
|
|
32
|
+
[wrapImage] pnpm run dev:wrapImage exited with code SIGINT
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
|
|
2
|
+
> @treelocator/runtime@0.3.0 test /Users/wende/projects/treelocatorjs/packages/runtime
|
|
3
|
+
> vitest run
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
RUN v2.1.9 /Users/wende/projects/treelocatorjs/packages/runtime
|
|
7
|
+
|
|
8
|
+
✓ src/functions/formatAncestryChain.test.ts (9 tests) 2ms
|
|
9
|
+
✓ src/functions/evalTemplate.test.ts (1 test) 1ms
|
|
10
|
+
✓ src/functions/cropPath.test.ts (2 tests) 1ms
|
|
11
|
+
✓ src/functions/mergeRects.test.ts (1 test) 1ms
|
|
12
|
+
✓ src/functions/getUsableFileName.test.tsx (4 tests) 2ms
|
|
13
|
+
✓ src/functions/transformPath.test.ts (3 tests) 6ms
|
|
14
|
+
ELIFECYCLE Test failed. See above for more details.
|
package/LICENSE
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Krzysztof Wende
|
|
4
|
+
Copyright (c) 2023 Michael Musil (original LocatorJS)
|
|
5
|
+
|
|
6
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
7
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
8
|
+
in the Software without restriction, including without limitation the rights
|
|
9
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
10
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
11
|
+
furnished to do so, subject to the following conditions:
|
|
12
|
+
|
|
13
|
+
The above copyright notice and this permission notice shall be included in all
|
|
14
|
+
copies or substantial portions of the Software.
|
|
15
|
+
|
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
17
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
18
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
19
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
20
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
21
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
22
|
+
SOFTWARE.
|
|
@@ -5,8 +5,9 @@ import { isStyledElement } from "./isStyled";
|
|
|
5
5
|
export function getAllParentsElementsAndRootComponent(fiber) {
|
|
6
6
|
const parentElements = [];
|
|
7
7
|
const deepestElement = fiber.stateNode;
|
|
8
|
-
if (!deepestElement || !(deepestElement instanceof
|
|
9
|
-
|
|
8
|
+
if (!deepestElement || !(deepestElement instanceof Element)) {
|
|
9
|
+
console.warn("[TreeLocator] Skipping fiber with non-Element stateNode:", fiber.type, fiber.stateNode);
|
|
10
|
+
return null;
|
|
10
11
|
}
|
|
11
12
|
let componentBox = deepestElement.getBoundingClientRect();
|
|
12
13
|
|
|
@@ -15,7 +16,7 @@ export function getAllParentsElementsAndRootComponent(fiber) {
|
|
|
15
16
|
while (currentFiber._debugOwner || currentFiber.return) {
|
|
16
17
|
currentFiber = currentFiber._debugOwner || currentFiber.return;
|
|
17
18
|
const currentElement = currentFiber.stateNode;
|
|
18
|
-
if (!currentElement || !(currentElement instanceof
|
|
19
|
+
if (!currentElement || !(currentElement instanceof Element)) {
|
|
19
20
|
return {
|
|
20
21
|
component: currentFiber,
|
|
21
22
|
parentElements,
|
|
@@ -30,5 +31,6 @@ export function getAllParentsElementsAndRootComponent(fiber) {
|
|
|
30
31
|
link: null
|
|
31
32
|
});
|
|
32
33
|
}
|
|
33
|
-
|
|
34
|
+
console.warn("[TreeLocator] Could not find root component for fiber:", fiber.type);
|
|
35
|
+
return null;
|
|
34
36
|
}
|
|
@@ -4,7 +4,7 @@ export function getAllWrappingParents(fiber) {
|
|
|
4
4
|
let currentFiber = fiber;
|
|
5
5
|
while (currentFiber.return) {
|
|
6
6
|
currentFiber = currentFiber.return;
|
|
7
|
-
if (currentFiber.stateNode && currentFiber.stateNode instanceof
|
|
7
|
+
if (currentFiber.stateNode && currentFiber.stateNode instanceof Element) {
|
|
8
8
|
return parents;
|
|
9
9
|
}
|
|
10
10
|
|
|
@@ -13,11 +13,15 @@ export function getElementInfo(found) {
|
|
|
13
13
|
const labels = [];
|
|
14
14
|
const fiber = findFiberByHtmlElement(found, false);
|
|
15
15
|
if (fiber) {
|
|
16
|
+
const result = getAllParentsElementsAndRootComponent(fiber);
|
|
17
|
+
if (!result) {
|
|
18
|
+
return null;
|
|
19
|
+
}
|
|
16
20
|
const {
|
|
17
21
|
component,
|
|
18
22
|
componentBox,
|
|
19
23
|
parentElements
|
|
20
|
-
} =
|
|
24
|
+
} = result;
|
|
21
25
|
const allPotentialComponentFibers = getAllWrappingParents(component);
|
|
22
26
|
|
|
23
27
|
// This handles a common case when the component root is basically the comopnent itself, so I want to go to usage of the component
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@treelocator/runtime",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.1",
|
|
4
4
|
"description": "TreeLocatorJS runtime for component ancestry tracking. Alt+click any element to copy its component tree to clipboard. Exposes window.__treelocator__ API for browser automation (Playwright, Puppeteer, Selenium, Cypress).",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"locator",
|
|
@@ -73,5 +73,5 @@
|
|
|
73
73
|
"directory": "packages/runtime"
|
|
74
74
|
},
|
|
75
75
|
"license": "MIT",
|
|
76
|
-
"gitHead": "
|
|
76
|
+
"gitHead": "f53c9d698aaee64837698b5c6803df5485d2a229"
|
|
77
77
|
}
|
|
@@ -10,13 +10,12 @@ export function getAllParentsElementsAndRootComponent(fiber: Fiber): {
|
|
|
10
10
|
component: Fiber;
|
|
11
11
|
componentBox: SimpleDOMRect;
|
|
12
12
|
parentElements: ElementInfo[];
|
|
13
|
-
} {
|
|
13
|
+
} | null {
|
|
14
14
|
const parentElements: ElementInfo[] = [];
|
|
15
15
|
const deepestElement = fiber.stateNode;
|
|
16
|
-
if (!deepestElement || !(deepestElement instanceof
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
);
|
|
16
|
+
if (!deepestElement || !(deepestElement instanceof Element)) {
|
|
17
|
+
console.warn("[TreeLocator] Skipping fiber with non-Element stateNode:", fiber.type, fiber.stateNode);
|
|
18
|
+
return null;
|
|
20
19
|
}
|
|
21
20
|
let componentBox: SimpleDOMRect = deepestElement.getBoundingClientRect();
|
|
22
21
|
|
|
@@ -26,7 +25,7 @@ export function getAllParentsElementsAndRootComponent(fiber: Fiber): {
|
|
|
26
25
|
while (currentFiber._debugOwner || currentFiber.return) {
|
|
27
26
|
currentFiber = currentFiber._debugOwner || currentFiber.return!;
|
|
28
27
|
const currentElement = currentFiber.stateNode;
|
|
29
|
-
if (!currentElement || !(currentElement instanceof
|
|
28
|
+
if (!currentElement || !(currentElement instanceof Element)) {
|
|
30
29
|
return {
|
|
31
30
|
component: currentFiber,
|
|
32
31
|
parentElements,
|
|
@@ -48,5 +47,6 @@ export function getAllParentsElementsAndRootComponent(fiber: Fiber): {
|
|
|
48
47
|
link: null,
|
|
49
48
|
});
|
|
50
49
|
}
|
|
51
|
-
|
|
50
|
+
console.warn("[TreeLocator] Could not find root component for fiber:", fiber.type);
|
|
51
|
+
return null;
|
|
52
52
|
}
|
|
@@ -25,8 +25,11 @@ export function getElementInfo(found: HTMLElement): FullElementInfo | null {
|
|
|
25
25
|
|
|
26
26
|
const fiber = findFiberByHtmlElement(found, false);
|
|
27
27
|
if (fiber) {
|
|
28
|
-
const
|
|
29
|
-
|
|
28
|
+
const result = getAllParentsElementsAndRootComponent(fiber);
|
|
29
|
+
if (!result) {
|
|
30
|
+
return null;
|
|
31
|
+
}
|
|
32
|
+
const { component, componentBox, parentElements } = result;
|
|
30
33
|
|
|
31
34
|
const allPotentialComponentFibers = getAllWrappingParents(component);
|
|
32
35
|
|