tldraw/packages/tldraw/setupTests.js
alex 45c8777ea0
reactive context menu overrides (#2697)
Previously, we were calling context menu `overrides` in a `useMemo`, so
they weren't updating reactively in the way that most of our other
schema overrides do. This diff calls `override` in a `useValue` instead
so it updates reactively.

It also fixes some issues with testing the `<Tldraw />` component:
currently we get a lot of errors in the console about updates not being
wrapped in `act`. These are caused by the fill patterns at different
zoom levels popping in without us waiting for them. Now, we have a
helper for rendering the tldraw component that waits for this correctly
and stops the error.

### Change Type

- [x] `patch` — Bug fix

### Test Plan


- [x] Unit Tests


### Release Notes

- Context Menu overrides will now update reactively
2024-01-31 16:35:49 +00:00

69 lines
1.5 KiB
JavaScript

require('fake-indexeddb/auto')
require('jest-canvas-mock')
global.ResizeObserver = require('resize-observer-polyfill')
global.crypto ??= new (require('@peculiar/webcrypto').Crypto)()
global.FontFace = class FontFace {
load() {
return Promise.resolve()
}
}
document.fonts = {
add: () => {},
delete: () => {},
forEach: () => {},
[Symbol.iterator]: () => [][Symbol.iterator](),
}
Object.defineProperty(window, 'matchMedia', {
writable: true,
value: jest.fn().mockImplementation((query) => ({
matches: false,
media: query,
onchange: null,
addListener: jest.fn(), // Deprecated
removeListener: jest.fn(), // Deprecated
addEventListener: jest.fn(),
removeEventListener: jest.fn(),
dispatchEvent: jest.fn(),
})),
})
Object.defineProperty(global.URL, 'createObjectURL', {
writable: true,
value: jest.fn(),
})
// Extract verson from package.json
const { version } = require('./package.json')
window.fetch = async (input, init) => {
if (input === `https://unpkg.com/@tldraw/assets@${version}/translations/en.json`) {
const json = await import('@tldraw/assets/translations/main.json')
return {
ok: true,
json: async () => json.default,
}
}
if (input === '/icons/icon/icon-names.json') {
return {
ok: true,
json: async () => [],
}
}
throw new Error(`Unhandled request: ${input}`)
}
window.DOMRect = class DOMRect {
static fromRect(rect) {
return new DOMRect(rect.x, rect.y, rect.width, rect.height)
}
constructor(x, y, width, height) {
this.x = x
this.y = y
this.width = width
this.height = height
}
}