Skip to content

Commit 3a5c518

Browse files
ci: apply automated fixes
1 parent 995d631 commit 3a5c518

10 files changed

Lines changed: 147 additions & 133 deletions

File tree

knip.json

Lines changed: 5 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,13 @@
11
{
22
"$schema": "https://unpkg.com/knip@5/schema.json",
3-
"ignoreDependencies": [
4-
"@faker-js/faker"
5-
],
6-
"ignoreWorkspaces": [
7-
"examples/**"
8-
],
3+
"ignoreDependencies": ["@faker-js/faker"],
4+
"ignoreWorkspaces": ["examples/**"],
95
"workspaces": {
106
"packages/devtools-utils": {
11-
"ignoreDependencies": [
12-
"react",
13-
"solid-js",
14-
"@types/react"
15-
]
7+
"ignoreDependencies": ["react", "solid-js", "@types/react"]
168
},
179
"packages/solid-devtools": {
18-
"ignore": [
19-
"**/core.tsx"
20-
]
10+
"ignore": ["**/core.tsx"]
2111
}
2212
}
23-
}
13+
}

packages/devtools-utils/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,4 +70,4 @@
7070
"test:build": "publint --strict",
7171
"build": "vite build"
7272
}
73-
}
73+
}
Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
export * from './panel'
1+
export * from './panel'
Lines changed: 19 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,21 @@
1-
import { describe, expect, it } from "vitest";
2-
import { createReactPanel } from "./panel";
1+
import { describe, expect, it } from 'vitest'
2+
import { createReactPanel } from './panel'
33

4+
describe('createReactPanel', () => {
5+
it('should create a React component when provided with a package name', () => {
6+
const [ReactDevtoolsPanel, NoOpReactDevtoolsPanel] = createReactPanel(
7+
'@tanstack/devtools-react',
8+
)
9+
expect(ReactDevtoolsPanel).toBeDefined()
10+
expect(NoOpReactDevtoolsPanel).toBeDefined()
11+
})
412

5-
describe("createReactPanel", () => {
6-
it("should create a React component when provided with a package name", () => {
7-
const [ReactDevtoolsPanel, NoOpReactDevtoolsPanel] = createReactPanel('@tanstack/devtools-react');
8-
expect(ReactDevtoolsPanel).toBeDefined();
9-
expect(NoOpReactDevtoolsPanel).toBeDefined();
10-
});
11-
12-
it("should create a React component when provided with a different import name", () => {
13-
const [ReactDevtoolsPanel, NoOpReactDevtoolsPanel] = createReactPanel('@tanstack/devtools-react', 'default');
14-
expect(ReactDevtoolsPanel).toBeDefined();
15-
expect(NoOpReactDevtoolsPanel).toBeDefined();
16-
});
17-
});
13+
it('should create a React component when provided with a different import name', () => {
14+
const [ReactDevtoolsPanel, NoOpReactDevtoolsPanel] = createReactPanel(
15+
'@tanstack/devtools-react',
16+
'default',
17+
)
18+
expect(ReactDevtoolsPanel).toBeDefined()
19+
expect(NoOpReactDevtoolsPanel).toBeDefined()
20+
})
21+
})

packages/devtools-utils/src/react/panel.tsx

Lines changed: 17 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -21,23 +21,28 @@ export interface DevtoolsPanelProps {
2121
* const [ReactDevtoolsPanel, NoOpReactDevtoolsPanel] = createReactPanel('@tanstack/devtools-react', 'DevtoolsCore')
2222
* ```
2323
*/
24-
export function createReactPanel<TComponentProps extends DevtoolsPanelProps | undefined, TCoreDevtoolsClass extends {
25-
mount: (el: HTMLElement, theme: 'light' | 'dark') => void
26-
unmount: () => void
27-
}>(devtoolsPackageName: string, importName = 'default') {
24+
export function createReactPanel<
25+
TComponentProps extends DevtoolsPanelProps | undefined,
26+
TCoreDevtoolsClass extends {
27+
mount: (el: HTMLElement, theme: 'light' | 'dark') => void
28+
unmount: () => void
29+
},
30+
>(devtoolsPackageName: string, importName = 'default') {
2831
function Panel(props: TComponentProps) {
2932
const devToolRef = useRef<HTMLDivElement>(null)
3033
const devtools = useRef<TCoreDevtoolsClass | null>(null)
3134
useEffect(() => {
3235
if (devtools.current) return
3336

34-
import(/* @vite-ignore */devtoolsPackageName).then(({ [importName]: Core }) => {
35-
devtools.current = new Core()
37+
import(/* @vite-ignore */ devtoolsPackageName).then(
38+
({ [importName]: Core }) => {
39+
devtools.current = new Core()
3640

37-
if (devToolRef.current && devtools.current) {
38-
devtools.current.mount(devToolRef.current, props?.theme ?? 'dark')
39-
}
40-
})
41+
if (devToolRef.current && devtools.current) {
42+
devtools.current.mount(devToolRef.current, props?.theme ?? 'dark')
43+
}
44+
},
45+
)
4146

4247
return () => {
4348
devtools.current?.unmount()
@@ -48,7 +53,7 @@ export function createReactPanel<TComponentProps extends DevtoolsPanelProps | un
4853
}
4954

5055
function NoOpPanel() {
51-
return null;
56+
return null
5257
}
53-
return [Panel, NoOpPanel] as const;
58+
return [Panel, NoOpPanel] as const
5459
}
Lines changed: 86 additions & 73 deletions
Original file line numberDiff line numberDiff line change
@@ -1,96 +1,109 @@
1-
import { beforeEach, describe, expect, it, vi } from "vitest";
2-
import { constructCoreClass } from "./class";
1+
import { beforeEach, describe, expect, it, vi } from 'vitest'
2+
import { constructCoreClass } from './class'
33

4-
const lazyImportMock = vi.fn((fn) => fn());
5-
const renderMock = vi.fn();
6-
const portalMock = vi.fn((props: any) => <div>{props.children}</div>);
4+
const lazyImportMock = vi.fn((fn) => fn())
5+
const renderMock = vi.fn()
6+
const portalMock = vi.fn((props: any) => <div>{props.children}</div>)
77

8-
vi.mock("solid-js", async () => {
9-
const actual = await vi.importActual<any>("solid-js");
8+
vi.mock('solid-js', async () => {
9+
const actual = await vi.importActual<any>('solid-js')
1010
return {
1111
...actual,
1212
lazy: lazyImportMock,
1313
}
14-
});
14+
})
1515

16-
vi.mock("solid-js/web", async () => {
17-
const actual = await vi.importActual<any>("solid-js/web");
16+
vi.mock('solid-js/web', async () => {
17+
const actual = await vi.importActual<any>('solid-js/web')
1818
return {
1919
...actual,
2020
render: renderMock,
2121
Portal: portalMock,
22-
};
23-
});
24-
22+
}
23+
})
2524

26-
describe("constructCoreClass", () => {
25+
describe('constructCoreClass', () => {
2726
beforeEach(() => {
28-
vi.clearAllMocks();
27+
vi.clearAllMocks()
28+
})
29+
it('should export DevtoolsCore and NoOpDevtoolsCore classes and make no calls to Solid.js primitives', () => {
30+
const [DevtoolsCore, NoOpDevtoolsCore] = constructCoreClass(
31+
'@test/devtools-mock-package',
32+
)
33+
expect(DevtoolsCore).toBeDefined()
34+
expect(NoOpDevtoolsCore).toBeDefined()
35+
expect(lazyImportMock).not.toHaveBeenCalled()
2936
})
30-
it("should export DevtoolsCore and NoOpDevtoolsCore classes and make no calls to Solid.js primitives", () => {
31-
const [DevtoolsCore, NoOpDevtoolsCore] = constructCoreClass("@test/devtools-mock-package");
32-
expect(DevtoolsCore).toBeDefined();
33-
expect(NoOpDevtoolsCore).toBeDefined();
34-
expect(lazyImportMock).not.toHaveBeenCalled();
35-
});
36-
37-
it("DevtoolsCore should call solid primitives when mount is called", async () => {
38-
const [DevtoolsCore, _] = constructCoreClass("@test/devtools-mock-package");
39-
const instance = new DevtoolsCore();
40-
await instance.mount(document.createElement("div"), "dark")
41-
expect(renderMock).toHaveBeenCalled();
42-
});
43-
44-
it("DevtoolsCore should throw if mount is called twice without unmounting", async () => {
45-
const [DevtoolsCore, _] = constructCoreClass("@test/devtools-mock-package");
46-
const instance = new DevtoolsCore();
47-
await instance.mount(document.createElement("div"), "dark")
48-
await expect(instance.mount(document.createElement("div"), "dark")).rejects.toThrow("Devtools is already mounted");
49-
});
5037

51-
it("DevtoolsCore should throw if unmount is called before mount", () => {
52-
const [DevtoolsCore, _] = constructCoreClass("@test/devtools-mock-package");
53-
const instance = new DevtoolsCore();
54-
expect(() => instance.unmount()).toThrow("Devtools is not mounted");
55-
});
38+
it('DevtoolsCore should call solid primitives when mount is called', async () => {
39+
const [DevtoolsCore, _] = constructCoreClass('@test/devtools-mock-package')
40+
const instance = new DevtoolsCore()
41+
await instance.mount(document.createElement('div'), 'dark')
42+
expect(renderMock).toHaveBeenCalled()
43+
})
5644

57-
it("DevtoolsCore should allow mount after unmount", async () => {
58-
const [DevtoolsCore, _] = constructCoreClass("@test/devtools-mock-package");
59-
const instance = new DevtoolsCore();
60-
await instance.mount(document.createElement("div"), "dark")
61-
instance.unmount();
62-
await expect(instance.mount(document.createElement("div"), "dark")).resolves.not.toThrow();
63-
});
45+
it('DevtoolsCore should throw if mount is called twice without unmounting', async () => {
46+
const [DevtoolsCore, _] = constructCoreClass('@test/devtools-mock-package')
47+
const instance = new DevtoolsCore()
48+
await instance.mount(document.createElement('div'), 'dark')
49+
await expect(
50+
instance.mount(document.createElement('div'), 'dark'),
51+
).rejects.toThrow('Devtools is already mounted')
52+
})
6453

54+
it('DevtoolsCore should throw if unmount is called before mount', () => {
55+
const [DevtoolsCore, _] = constructCoreClass('@test/devtools-mock-package')
56+
const instance = new DevtoolsCore()
57+
expect(() => instance.unmount()).toThrow('Devtools is not mounted')
58+
})
6559

60+
it('DevtoolsCore should allow mount after unmount', async () => {
61+
const [DevtoolsCore, _] = constructCoreClass('@test/devtools-mock-package')
62+
const instance = new DevtoolsCore()
63+
await instance.mount(document.createElement('div'), 'dark')
64+
instance.unmount()
65+
await expect(
66+
instance.mount(document.createElement('div'), 'dark'),
67+
).resolves.not.toThrow()
68+
})
6669

67-
it("NoOpDevtoolsCore should not call any solid primitives when mount is called", async () => {
68-
const [_, NoOpDevtoolsCore] = constructCoreClass("@test/devtools-mock-package");
69-
const noOpInstance = new NoOpDevtoolsCore();
70-
await noOpInstance.mount(document.createElement("div"), "dark")
70+
it('NoOpDevtoolsCore should not call any solid primitives when mount is called', async () => {
71+
const [_, NoOpDevtoolsCore] = constructCoreClass(
72+
'@test/devtools-mock-package',
73+
)
74+
const noOpInstance = new NoOpDevtoolsCore()
75+
await noOpInstance.mount(document.createElement('div'), 'dark')
7176

72-
expect(lazyImportMock).not.toHaveBeenCalled();
73-
expect(renderMock).not.toHaveBeenCalled();
74-
expect(portalMock).not.toHaveBeenCalled();
75-
});
77+
expect(lazyImportMock).not.toHaveBeenCalled()
78+
expect(renderMock).not.toHaveBeenCalled()
79+
expect(portalMock).not.toHaveBeenCalled()
80+
})
7681

77-
it("NoOpDevtoolsCore should not throw if mount is called multiple times", async () => {
78-
const [_, NoOpDevtoolsCore] = constructCoreClass("@test/devtools-mock-package");
79-
const noOpInstance = new NoOpDevtoolsCore();
80-
await noOpInstance.mount(document.createElement("div"), "dark")
81-
await expect(noOpInstance.mount(document.createElement("div"), "dark")).resolves.not.toThrow();
82-
});
82+
it('NoOpDevtoolsCore should not throw if mount is called multiple times', async () => {
83+
const [_, NoOpDevtoolsCore] = constructCoreClass(
84+
'@test/devtools-mock-package',
85+
)
86+
const noOpInstance = new NoOpDevtoolsCore()
87+
await noOpInstance.mount(document.createElement('div'), 'dark')
88+
await expect(
89+
noOpInstance.mount(document.createElement('div'), 'dark'),
90+
).resolves.not.toThrow()
91+
})
8392

84-
it("NoOpDevtoolsCore should not throw if unmount is called before mount", () => {
85-
const [_, NoOpDevtoolsCore] = constructCoreClass("@test/devtools-mock-package");
86-
const noOpInstance = new NoOpDevtoolsCore();
87-
expect(() => noOpInstance.unmount()).not.toThrow();
88-
});
93+
it('NoOpDevtoolsCore should not throw if unmount is called before mount', () => {
94+
const [_, NoOpDevtoolsCore] = constructCoreClass(
95+
'@test/devtools-mock-package',
96+
)
97+
const noOpInstance = new NoOpDevtoolsCore()
98+
expect(() => noOpInstance.unmount()).not.toThrow()
99+
})
89100

90-
it("NoOpDevtoolsCore should not throw if unmount is called after mount", async () => {
91-
const [_, NoOpDevtoolsCore] = constructCoreClass("@test/devtools-mock-package");
92-
const noOpInstance = new NoOpDevtoolsCore();
93-
await noOpInstance.mount(document.createElement("div"), "dark")
94-
expect(() => noOpInstance.unmount()).not.toThrow();
95-
});
96-
});
101+
it('NoOpDevtoolsCore should not throw if unmount is called after mount', async () => {
102+
const [_, NoOpDevtoolsCore] = constructCoreClass(
103+
'@test/devtools-mock-package',
104+
)
105+
const noOpInstance = new NoOpDevtoolsCore()
106+
await noOpInstance.mount(document.createElement('div'), 'dark')
107+
expect(() => noOpInstance.unmount()).not.toThrow()
108+
})
109+
})

packages/devtools-utils/src/solid/class.tsx

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/** @jsxImportSource solid-js - we use Solid.js as JSX here */
22

33
/**
4-
* Constructs the core class for the Devtools.
4+
* Constructs the core class for the Devtools.
55
* This utility is used to construct a lazy loaded Solid component for the Devtools.
66
* It returns a tuple containing the main DevtoolsCore class and a NoOpDevtoolsCore class.
77
* The NoOpDevtoolsCore class is a no-op implementation that can be used for production if you want to explicitly exclude
@@ -16,8 +16,7 @@ export function constructCoreClass(importPath: string) {
1616
#Component: any
1717
#ThemeProvider: any
1818

19-
constructor() {
20-
}
19+
constructor() {}
2120

2221
async mount<T extends HTMLElement>(el: T, theme: 'light' | 'dark') {
2322
const { lazy } = await import('solid-js')
@@ -27,7 +26,7 @@ export function constructCoreClass(importPath: string) {
2726
}
2827
const mountTo = el
2928
const dispose = render(() => {
30-
this.#Component = lazy(() => import(/** @vite-ignore */importPath))
29+
this.#Component = lazy(() => import(/** @vite-ignore */ importPath))
3130
const Devtools = this.#Component
3231
this.#ThemeProvider = lazy(() =>
3332
import('@tanstack/devtools-ui').then((mod) => ({
@@ -62,8 +61,8 @@ export function constructCoreClass(importPath: string) {
6261
constructor() {
6362
super()
6463
}
65-
async mount<T extends HTMLElement>(_el: T, _theme: 'light' | 'dark') { }
66-
unmount() { }
64+
async mount<T extends HTMLElement>(_el: T, _theme: 'light' | 'dark') {}
65+
unmount() {}
6766
}
6867
return [DevtoolsCore, NoOpDevtoolsCore] as const
69-
}
68+
}
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
1-
export * from "./class"
2-
export * from './panel'
1+
export * from './class'
2+
export * from './panel'

packages/devtools-utils/src/solid/panel.tsx

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,16 @@ export interface DevtoolsPanelProps {
66
theme?: 'light' | 'dark'
77
}
88

9-
export function createSolidPanel<TComponentProps extends DevtoolsPanelProps | undefined>(importPath: string, importName = "default") {
9+
export function createSolidPanel<
10+
TComponentProps extends DevtoolsPanelProps | undefined,
11+
>(importPath: string, importName = 'default') {
1012
function Panel(props: TComponentProps) {
1113
let devToolRef: HTMLDivElement | undefined
1214

1315
onMount(async () => {
14-
const devtools = await import(/* @vite-ignore */importPath).then(mod => new mod[importName]())
16+
const devtools = await import(/* @vite-ignore */ importPath).then(
17+
(mod) => new mod[importName](),
18+
)
1519
if (devToolRef) {
1620
devtools.mount(devToolRef, props?.theme ?? 'dark')
1721

@@ -25,9 +29,8 @@ export function createSolidPanel<TComponentProps extends DevtoolsPanelProps | un
2529
}
2630

2731
function NoOpPanel() {
28-
return null;
32+
return null
2933
}
3034

31-
return [Panel, NoOpPanel] as const;
35+
return [Panel, NoOpPanel] as const
3236
}
33-

0 commit comments

Comments
 (0)