Merge branch 'main' into all-contributors/add-tbertrand7

Author: ph-fritsche

src/clipboard/paste.ts

@@ -1,5 +1,9 @@
 import {Config, Instance} from '../setup'
-import {createDataTransfer, readDataTransferFromClipboard} from '../utils'
+import {
+  createDataTransfer,
+  getWindow,
+  readDataTransferFromClipboard,
+} from '../utils'
 
 export async function paste(
   this: Instance,
@@ -10,7 +14,7 @@ export async function paste(
 
   const dataTransfer: DataTransfer =
     (typeof clipboardData === 'string'
-      ? getClipboardDataFromString(clipboardData)
+      ? getClipboardDataFromString(doc, clipboardData)
       : clipboardData) ??
     (await readDataTransferFromClipboard(doc).catch(() => {
       throw new Error(
@@ -23,8 +27,8 @@ export async function paste(
   })
 }
 
-function getClipboardDataFromString(text: string) {
-  const dt = createDataTransfer()
+function getClipboardDataFromString(doc: Document, text: string) {
+  const dt = createDataTransfer(getWindow(doc))
   dt.setData('text', text)
   return dt
 }

src/event/behavior/click.ts

@@ -1,4 +1,11 @@
-import {blur, cloneEvent, focus, isElementType, isFocusable} from '../../utils'
+import {
+  blur,
+  cloneEvent,
+  focus,
+  getWindow,
+  isElementType,
+  isFocusable,
+} from '../../utils'
 import {dispatchEvent} from '../dispatchEvent'
 import {behavior} from './registry'
 
@@ -17,7 +24,7 @@ behavior.click = (event, target, config) => {
       // blur fires when the file selector pops up
       blur(target)
 
-      target.dispatchEvent(new Event('fileDialog'))
+      target.dispatchEvent(new (getWindow(target).Event)('fileDialog'))
 
       // focus fires after the file selector has been closed
       focus(target)

src/pointer/pointerPress.ts

@@ -315,7 +315,7 @@ function mousedownDefaultBehavior({
         offset: end,
       })
 
-      const range = new Range()
+      const range = target.ownerDocument.createRange()
       range.setStart(startNode, startOffset)
       range.setEnd(endNode, endOffset)
 

src/utils/dataTransfer/Blob.ts

@@ -1,6 +1,6 @@
 // jsdom does not implement Blob.text()
 
-export function readBlobText(blob: Blob) {
+export function readBlobText(blob: Blob, FileReader: {new (): FileReader}) {
   return new Promise<string>((res, rej) => {
     const fr = new FileReader()
     fr.onerror = rej

src/utils/dataTransfer/Clipboard.ts

@@ -1,9 +1,12 @@
 // Clipboard is not available in jsdom
 
 import {createDataTransfer, getBlobFromDataTransferItem, readBlobText} from '..'
+import {getWindow} from '../misc/getWindow'
 
 // Clipboard API is only fully available in secure context or for browser extensions.
 
+const Window = Symbol('Window reference')
+
 type ItemData = Record<string, Blob | string | Promise<Blob | string>>
 
 class ClipboardItemStub implements ClipboardItem {
@@ -25,13 +28,17 @@ class ClipboardItemStub implements ClipboardItem {
       )
     }
 
-    return data instanceof Blob ? data : new Blob([data], {type})
+    return data instanceof this[Window].Blob
+      ? data
+      : new this[Window].Blob([data], {type})
   }
+
+  [Window] = window
 }
 
 const ClipboardStubControl = Symbol('Manage ClipboardSub')
 
-class ClipboardStub extends EventTarget implements Clipboard {
+class ClipboardStub extends window.EventTarget implements Clipboard {
   private items: ClipboardItem[] = []
 
   async read() {
@@ -45,7 +52,9 @@ class ClipboardStub extends EventTarget implements Clipboard {
         ? 'text/plain'
         : item.types.find(t => t.startsWith('text/'))
       if (type) {
-        text += await item.getType(type).then(b => readBlobText(b))
+        text += await item
+          .getType(type)
+          .then(b => readBlobText(b, this[Window].FileReader))
       }
     }
     return text
@@ -56,9 +65,10 @@ class ClipboardStub extends EventTarget implements Clipboard {
   }
 
   async writeText(text: string) {
-    this.items = [createClipboardItem(text)]
+    this.items = [createClipboardItem(this[Window], text)]
   }
 
+  [Window] = window;
   [ClipboardStubControl]: {
     resetClipboardStub: () => void
     detachClipboardStub: () => void
@@ -69,22 +79,25 @@ class ClipboardStub extends EventTarget implements Clipboard {
 // lib.dom.d.ts lists only Promise<Blob|string>
 // https://developer.mozilla.org/en-US/docs/Web/API/ClipboardItem/ClipboardItem#syntax
 export function createClipboardItem(
+  window: Window & typeof globalThis,
   ...blobs: Array<Blob | string>
 ): ClipboardItem {
-  // use real ClipboardItem if available
-  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-  const constructor =
-    typeof ClipboardItem === 'undefined'
-      ? ClipboardItemStub
-      : /* istanbul ignore next */ ClipboardItem
-  return new constructor(
-    Object.fromEntries(
-      blobs.map(b => [
-        typeof b === 'string' ? 'text/plain' : b.type,
-        Promise.resolve(b),
-      ]),
-    ),
+  const data = Object.fromEntries(
+    blobs.map(b => [
+      typeof b === 'string' ? 'text/plain' : b.type,
+      Promise.resolve(b),
+    ]),
   )
+
+  // use real ClipboardItem if available
+  /* istanbul ignore else */
+  if (typeof window.ClipboardItem === 'undefined') {
+    const item = new ClipboardItemStub(data)
+    item[Window] = window
+    return item
+  } else {
+    return new window.ClipboardItem(data)
+  }
 }
 
 export function attachClipboardStubToView(window: Window & typeof globalThis) {
@@ -98,9 +111,11 @@ export function attachClipboardStubToView(window: Window & typeof globalThis) {
   )
 
   let stub = new ClipboardStub()
+  stub[Window] = window
   const control = {
     resetClipboardStub: () => {
       stub = new ClipboardStub()
+      stub[Window] = window
       stub[ClipboardStubControl] = control
     },
     detachClipboardStub: () => {
@@ -140,17 +155,21 @@ export function detachClipboardStubFromView(
 }
 
 export async function readDataTransferFromClipboard(document: Document) {
-  const clipboard = document.defaultView?.navigator.clipboard
+  const window = document.defaultView
+  const clipboard = window?.navigator.clipboard
   const items = clipboard && (await clipboard.read())
 
   if (!items) {
     throw new Error('The Clipboard API is unavailable.')
   }
 
-  const dt = createDataTransfer()
+  const dt = createDataTransfer(window)
   for (const item of items) {
     for (const type of item.types) {
-      dt.setData(type, await item.getType(type).then(b => readBlobText(b)))
+      dt.setData(
+        type,
+        await item.getType(type).then(b => readBlobText(b, window.FileReader)),
+      )
     }
   }
   return dt
@@ -160,13 +179,14 @@ export async function writeDataTransferToClipboard(
   document: Document,
   clipboardData: DataTransfer,
 ) {
-  const clipboard = document.defaultView?.navigator.clipboard
+  const window = getWindow(document)
+  const clipboard = window.navigator.clipboard as Clipboard | undefined
 
   const items = []
   for (let i = 0; i < clipboardData.items.length; i++) {
     const dtItem = clipboardData.items[i]
-    const blob = getBlobFromDataTransferItem(dtItem)
-    items.push(createClipboardItem(blob))
+    const blob = getBlobFromDataTransferItem(window, dtItem)
+    items.push(createClipboardItem(window, blob))
   }
 
   const written =

src/utils/dataTransfer/DataTransfer.ts

@@ -133,26 +133,31 @@ class DataTransferStub implements DataTransfer {
   setDragImage() {}
 }
 
-export function createDataTransfer(files: File[] = []): DataTransfer {
+export function createDataTransfer(
+  window: Window & typeof globalThis,
+  files: File[] = [],
+): DataTransfer {
   // Use real DataTransfer if available
-  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
   const dt =
-    typeof DataTransfer === 'undefined'
+    typeof window.DataTransfer === 'undefined'
       ? (new DataTransferStub() as DataTransfer)
-      : /* istanbul ignore next */ new DataTransfer()
+      : /* istanbul ignore next */ new window.DataTransfer()
 
   Object.defineProperty(dt, 'files', {get: () => createFileList(files)})
 
   return dt
 }
 
-export function getBlobFromDataTransferItem(item: DataTransferItem) {
+export function getBlobFromDataTransferItem(
+  window: Window & typeof globalThis,
+  item: DataTransferItem,
+) {
   if (item.kind === 'file') {
     return item.getAsFile() as File
   }
   let data: string = ''
   item.getAsString(s => {
     data = s
   })
-  return new Blob([data], {type: item.type})
+  return new window.Blob([data], {type: item.type})
 }

src/utils/focus/copySelection.ts

@@ -1,6 +1,7 @@
 import {getUISelection, getUIValue} from '../../document'
 import {createDataTransfer} from '../dataTransfer/DataTransfer'
 import {EditableInputType} from '../edit/isEditable'
+import {getWindow} from '../misc/getWindow'
 import {hasOwnSelection} from './selection'
 
 export function copySelection(target: Element) {
@@ -9,7 +10,7 @@ export function copySelection(target: Element) {
     : // TODO: We could implement text/html copying of DOM nodes here
       {'text/plain': String(target.ownerDocument.getSelection())}
 
-  const dt = createDataTransfer()
+  const dt = createDataTransfer(getWindow(target))
   for (const type in data) {
     if (data[type]) {
       dt.setData(type, data[type])

src/utils/index.ts

@@ -31,6 +31,7 @@ export * from './misc/cloneEvent'
 export * from './misc/eventWrapper'
 export * from './misc/findClosest'
 export * from './misc/getDocumentFromNode'
+export * from './misc/getWindow'
 export * from './misc/isDescendantOrSelf'
 export * from './misc/isElementType'
 export * from './misc/isVisible'

src/utils/misc/getWindow.ts

@@ -0,0 +1,5 @@
+import {getWindowFromNode} from '@testing-library/dom/dist/helpers.js'
+
+export function getWindow(node: Node) {
+  return getWindowFromNode(node) as Window & typeof globalThis
+}

src/utils/misc/isVisible.ts

@@ -1,7 +1,7 @@
-import {getWindowFromNode} from '@testing-library/dom/dist/helpers.js'
+import {getWindow} from './getWindow'
 
 export function isVisible(element: Element): boolean {
-  const window = getWindowFromNode(element)
+  const window = getWindow(element)
 
   for (
     let el: Element | null = element;