diff --git a/frontend/package-lock.json b/frontend/package-lock.json index 38b1c8cf78..e14b4316cf 100644 --- a/frontend/package-lock.json +++ b/frontend/package-lock.json @@ -20,6 +20,7 @@ "monaco-editor": "^0.34.1", "monaco-editor-workers": "^0.34.2", "monaco-languageclient": "4.0.1", + "set-interval-async": "^3.0.2", "svelte-autosize": "^1.0.1", "svelte-chartjs": "^3.0.1", "vscode-ws-jsonrpc": "^2.0.0" @@ -5554,6 +5555,14 @@ "dev": true, "optional": true }, + "node_modules/set-interval-async": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/set-interval-async/-/set-interval-async-3.0.2.tgz", + "integrity": "sha512-s8Jl35TVylbhgeYbTJ3y3h/KnBCGvDPHyuG02My82YNwgKRErpmvNsWWec5zpt4jqTKPZyRmgCEkeFb07+j7EA==", + "engines": { + "node": ">= 14.0.0" + } + }, "node_modules/shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -10748,6 +10757,11 @@ } } }, + "set-interval-async": { + "version": "3.0.2", + "resolved": "https://registry.npmjs.org/set-interval-async/-/set-interval-async-3.0.2.tgz", + "integrity": "sha512-s8Jl35TVylbhgeYbTJ3y3h/KnBCGvDPHyuG02My82YNwgKRErpmvNsWWec5zpt4jqTKPZyRmgCEkeFb07+j7EA==" + }, "shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", diff --git a/frontend/package.json b/frontend/package.json index 6eb1dd7dde..3fa1b56d14 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -69,6 +69,7 @@ "monaco-editor": "^0.34.1", "monaco-editor-workers": "^0.34.2", "monaco-languageclient": "4.0.1", + "set-interval-async": "^3.0.2", "svelte-autosize": "^1.0.1", "svelte-chartjs": "^3.0.1", "vscode-ws-jsonrpc": "^2.0.0" diff --git a/frontend/src/lib/components/TestJobLoader.svelte b/frontend/src/lib/components/TestJobLoader.svelte index 9511fe1a0c..513a4e301e 100644 --- a/frontend/src/lib/components/TestJobLoader.svelte +++ b/frontend/src/lib/components/TestJobLoader.svelte @@ -4,6 +4,11 @@ import { onDestroy } from 'svelte' import type { Preview } from '$lib/gen/models/Preview' import { createEventDispatcher } from 'svelte' + import { + setIntervalAsync, + clearIntervalAsync, + type SetIntervalAsyncTimer + } from 'set-interval-async' export let isLoading = false export let job: Job | undefined = undefined @@ -13,14 +18,14 @@ const dispatch = createEventDispatcher() $: workspace = workspaceOverride ?? $workspaceStore - let intervalId: NodeJS.Timer + let intervalId: SetIntervalAsyncTimer | undefined = undefined let syncIteration: number = 0 let ITERATIONS_BEFORE_SLOW_REFRESH = 100 export async function abstractRun(fn: () => Promise) { try { - intervalId && clearInterval(intervalId) + intervalId && clearIntervalAsync(intervalId) if (isLoading && job) { JobService.cancelQueuedJob({ workspace: workspace!, @@ -93,15 +98,14 @@ } export async function watchJob(testId: string) { - console.log('watch jobs') - intervalId && clearInterval(intervalId) + intervalId && clearIntervalAsync(intervalId) job = undefined syncIteration = 0 const isCompleted = await loadTestJob(testId) if (!isCompleted) { isLoading = true - intervalId = setInterval(() => { - syncer(testId) + intervalId = setIntervalAsync(async () => { + await syncer(testId) }, 500) } } @@ -129,7 +133,7 @@ if (job?.type === 'CompletedJob') { //only CompletedJob has success property isCompleted = true - intervalId && clearInterval(intervalId) + intervalId && clearIntervalAsync(intervalId) if (isLoading) { dispatch('done', job) isLoading = false @@ -137,7 +141,7 @@ } notfound = false } catch (err) { - intervalId && clearInterval(intervalId) + intervalId && clearIntervalAsync(intervalId) if (err.status === 404) { notfound = true } @@ -146,16 +150,16 @@ return isCompleted } - function syncer(id: string): void { + async function syncer(id: string): Promise { if (syncIteration == ITERATIONS_BEFORE_SLOW_REFRESH) { - intervalId && clearInterval(intervalId) - intervalId = setInterval(() => syncer(id), 2000) + intervalId && clearIntervalAsync(intervalId) + intervalId = setIntervalAsync(async () => await syncer(id), 2000) } syncIteration++ - loadTestJob(id) + await loadTestJob(id) } onDestroy(() => { - intervalId && clearInterval(intervalId) + intervalId && clearIntervalAsync(intervalId) })