Fix an issue with addEventListener
in old Safari (pre v14) (#2114)
Seems Safari only added `MediaQueryList: change event` in version 14. This is a workaround for older versions. https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/change_event Reported here https://discord.com/channels/859816885297741824/926464446694580275/1166028196832092282 ### Change Type - [x] `patch` — Bug fix - [ ] `minor` — New feature - [ ] `major` — Breaking change - [ ] `dependencies` — Changes to package dependencies[^1] - [ ] `documentation` — Changes to the documentation only[^2] - [ ] `tests` — Changes to any test code only[^2] - [ ] `internal` — Any other changes that don't affect the published package[^2] - [ ] I don't know [^1]: publishes a `patch` release, for devDependencies use `internal` [^2]: will not publish a new version ### Release Notes - Fixes an issue with `addEventListener` on MediaQueryList object in old versions of Safari.
This commit is contained in:
parent
94f78652cc
commit
bc832bae6f
1 changed files with 17 additions and 2 deletions
|
@ -21,9 +21,24 @@ export function useDocumentEvents() {
|
|||
}
|
||||
const mqString = `(resolution: ${window.devicePixelRatio}dppx)`
|
||||
const media = matchMedia(mqString)
|
||||
media.addEventListener('change', updatePixelRatio)
|
||||
// Safari only started supporting `addEventListener('change',...) in version 14
|
||||
// https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/change_event
|
||||
const safariCb = (ev: any) => {
|
||||
if (ev.type === 'change') {
|
||||
updatePixelRatio()
|
||||
}
|
||||
}
|
||||
if (media.addEventListener) {
|
||||
media.addEventListener('change', updatePixelRatio)
|
||||
} else if (media.addListener) {
|
||||
media.addListener(safariCb)
|
||||
}
|
||||
remove = () => {
|
||||
media.removeEventListener('change', updatePixelRatio)
|
||||
if (media.removeEventListener) {
|
||||
media.removeEventListener('change', updatePixelRatio)
|
||||
} else if (media.removeListener) {
|
||||
media.removeListener(safariCb)
|
||||
}
|
||||
}
|
||||
editor.updateInstanceState({ devicePixelRatio: window.devicePixelRatio })
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue