fix(useWebSocket): webworker support (#3469)

Co-authored-by: Anthony Fu <anthonyfu117@hotmail.com>

packages/core/useWebSocket/index.ts

@@ -1,7 +1,7 @@
 import type { Ref } from 'vue-demi'
 import { ref, watch } from 'vue-demi'
 import type { Fn, MaybeRefOrGetter } from '@vueuse/shared'
-import { isClient, toRef, tryOnScopeDispose, useIntervalFn } from '@vueuse/shared'
+import { isClient, isWorker, toRef, tryOnScopeDispose, useIntervalFn } from '@vueuse/shared'
 import { useEventListener } from '../useEventListener'
 
 export type WebSocketStatus = 'OPEN' | 'CONNECTING' | 'CLOSED'
@@ -288,12 +288,13 @@ export function useWebSocket<Data = any>(
   }
 
   if (autoClose) {
-    useEventListener('beforeunload', () => close())
+    if (isClient)
+      useEventListener('beforeunload', () => close())
     tryOnScopeDispose(close)
   }
 
   const open = () => {
-    if (!isClient)
+    if (!isClient && !isWorker)
       return
     close()
     explicitlyClosed = false

packages/shared/utils/is.ts

@@ -1,5 +1,6 @@
 /* eslint-disable antfu/top-level-function */
 export const isClient = typeof window !== 'undefined' && typeof document !== 'undefined'
+export const isWorker = typeof WorkerGlobalScope !== 'undefined' && globalThis instanceof WorkerGlobalScope
 export const isDef = <T = any>(val?: T): val is T => typeof val !== 'undefined'
 export const notNullish = <T = any>(val?: T | null | undefined): val is T => val != null
 export const assert = (condition: boolean, ...infos: any[]) => {

tsconfig.json

@@ -2,7 +2,7 @@
   "compilerOptions": {
     "target": "es2020",
     "jsx": "preserve",
-    "lib": ["ESNext", "DOM", "DOM.Iterable"],
+    "lib": ["ESNext", "DOM", "DOM.Iterable", "webworker"],
     "baseUrl": ".",
     "rootDir": ".",
     "module": "esnext",