XMLDocument handling (#738)
* Add tests for SVGs * Add more null checks for Frontend._popup * Use null popup when on an XMLDocument
This commit is contained in:
toasted-nutbread
GitHub
parent
c26c4ae0cb
commit
1f564b94cb
@ -167,6 +167,7 @@ class Frontend {
|
||||
// Message handlers
|
||||
|
||||
_onMessagePopupSetVisibleOverride({visible}) {
|
||||
if (this._popup === null) { return; }
|
||||
this._popup.setVisibleOverride(visible);
|
||||
}
|
||||
|
||||
@ -226,15 +227,17 @@ class Frontend {
|
||||
}
|
||||
|
||||
_onClearSelection({passive}) {
|
||||
if (this._popup !== null) {
|
||||
this._popup.hide(!passive);
|
||||
this._popup.clearAutoPlayTimer();
|
||||
}
|
||||
this._updatePendingOptions();
|
||||
}
|
||||
|
||||
async _onActiveModifiersChanged({modifiers}) {
|
||||
if (areSetsEqual(modifiers, this._activeModifiers)) { return; }
|
||||
this._activeModifiers = modifiers;
|
||||
if (await this._popup.isVisible()) {
|
||||
if (this._popup !== null && await this._popup.isVisible()) {
|
||||
this._optionsUpdatePending = true;
|
||||
return;
|
||||
}
|
||||
@ -311,7 +314,9 @@ class Frontend {
|
||||
const popup = await popupPromise;
|
||||
const optionsContext = await this.getOptionsContext();
|
||||
if (this._updatePopupToken !== token) { return; }
|
||||
if (popup !== null) {
|
||||
await popup.setOptionsContext(optionsContext, this._id);
|
||||
}
|
||||
if (this._updatePopupToken !== token) { return; }
|
||||
|
||||
if (this._isSearchPage) {
|
||||
@ -323,6 +328,11 @@ class Frontend {
|
||||
}
|
||||
|
||||
async _getDefaultPopup() {
|
||||
const isXmlDocument = (typeof XMLDocument !== 'undefined' && document instanceof XMLDocument);
|
||||
if (isXmlDocument) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return this._popupFactory.getOrCreatePopup({depth: this._depth, ownerFrameId: this._frameId});
|
||||
}
|
||||
|
||||
@ -335,7 +345,12 @@ class Frontend {
|
||||
async _getIframeProxyPopup() {
|
||||
const targetFrameId = 0; // Root frameId
|
||||
await this._waitForFrontendReady(targetFrameId);
|
||||
|
||||
const {popupId} = await api.crossFrame.invoke(targetFrameId, 'getPopupInfo');
|
||||
if (popupId === null) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const popup = new PopupProxy(popupId, 0, null, targetFrameId, this._frameId, this._frameOffsetForwarder);
|
||||
popup.on('offsetNotFound', () => {
|
||||
this._allowRootFramePopupProxy = false;
|
||||
@ -368,6 +383,10 @@ class Frontend {
|
||||
}
|
||||
|
||||
async _search(textSource, cause) {
|
||||
if (this._popup === null) {
|
||||
return null;
|
||||
}
|
||||
|
||||
await this._updatePendingOptions();
|
||||
|
||||
let results = null;
|
||||
@ -466,7 +485,9 @@ class Frontend {
|
||||
}
|
||||
|
||||
_showPopupContent(textSource, optionsContext, details=null) {
|
||||
this._lastShowPromise = this._popup.showContent(
|
||||
this._lastShowPromise = (
|
||||
this._popup !== null ?
|
||||
this._popup.showContent(
|
||||
{
|
||||
source: this._id,
|
||||
optionsContext,
|
||||
@ -474,6 +495,8 @@ class Frontend {
|
||||
writingMode: textSource.getWritingMode()
|
||||
},
|
||||
details
|
||||
) :
|
||||
Promise.resolve()
|
||||
);
|
||||
this._lastShowPromise.catch((error) => {
|
||||
if (yomichan.isExtensionUnloaded) { return; }
|
||||
|
||||
15
test/data/html/test-document2-frame2.svg
Normal file
15
test/data/html/test-document2-frame2.svg
Normal file
@ -0,0 +1,15 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<style>
|
||||
:root {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
text {
|
||||
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
fill: #000000;
|
||||
dominant-baseline: hanging;
|
||||
}
|
||||
</style>
|
||||
<text x="7" y="12">ありがとう</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 375 B |
@ -58,6 +58,10 @@ function setup(container, fullscreenElement=null) {
|
||||
if (template !== null && templateContentContainer !== null) {
|
||||
const mode = container.dataset.shadowMode;
|
||||
const shadow = templateContentContainer.attachShadow({mode});
|
||||
|
||||
const containerStyles = document.querySelector('#container-styles');
|
||||
shadow.appendChild(containerStyles.cloneNode(true));
|
||||
|
||||
const content = document.importNode(template.content, true);
|
||||
setup(content);
|
||||
shadow.appendChild(content);
|
||||
|
||||
@ -8,6 +8,24 @@
|
||||
<link rel="stylesheet" href="test-stylesheet.css" />
|
||||
<script src="test-document2-script.js"></script>
|
||||
</head>
|
||||
<style id="container-styles">
|
||||
.container {
|
||||
width: 100%;
|
||||
height: 200px;
|
||||
border: 1px solid #d8d8d8;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.container-inner {
|
||||
background-color: #f8f8f8;
|
||||
padding: 0.5em;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
}
|
||||
</style>
|
||||
<body>
|
||||
|
||||
<h1>Yomichan Manual Tests</h1>
|
||||
@ -15,7 +33,7 @@
|
||||
|
||||
<y-test>
|
||||
<y-description>Standard content.</y-description>
|
||||
<div class="fullscreen-element" style="width: 100%; height: 200px; border: 1px solid #d8d8d8; position: relative;"><div style="background-color: #f8f8f8; padding: 0.5em; position: absolute; left: 0; top: 0; bottom: 0; right: 0;">
|
||||
<div class="fullscreen-element container"><div class="container-inner">
|
||||
<div>
|
||||
ありがとう
|
||||
</div>
|
||||
@ -30,7 +48,7 @@
|
||||
<div class="template-content-container"></div>
|
||||
<template>
|
||||
<link rel="stylesheet" href="test-stylesheet.css" />
|
||||
<div class="fullscreen-element" style="width: 100%; height: 200px; border: 1px solid #d8d8d8; position: relative;"><div style="background-color: #f8f8f8; padding: 0.5em; position: absolute; left: 0; top: 0; bottom: 0; right: 0;">
|
||||
<div class="fullscreen-element container"><div class="container-inner">
|
||||
<div>
|
||||
ありがとう
|
||||
</div>
|
||||
@ -46,7 +64,7 @@
|
||||
<div class="template-content-container"></div>
|
||||
<template>
|
||||
<link rel="stylesheet" href="test-stylesheet.css" />
|
||||
<div class="fullscreen-element" style="width: 100%; height: 200px; border: 1px solid #d8d8d8; position: relative;"><div style="background-color: #f8f8f8; padding: 0.5em; position: absolute; left: 0; top: 0; bottom: 0; right: 0;">
|
||||
<div class="fullscreen-element container"><div class="container-inner">
|
||||
<div>
|
||||
ありがとう
|
||||
</div>
|
||||
@ -59,14 +77,14 @@
|
||||
|
||||
<y-test>
|
||||
<y-description><iframe> element.</y-description>
|
||||
<iframe src="test-document2-frame1.html" allowfullscreen="true" style="width: 100%; height: 200px; border: 1px solid #d8d8d8;"></iframe>
|
||||
<iframe src="test-document2-frame1.html" allowfullscreen="true" class="container"></iframe>
|
||||
</y-test>
|
||||
|
||||
<y-test data-shadow-mode="open">
|
||||
<y-description><iframe> element inside of an open shadow DOM.</y-description>
|
||||
<div class="template-content-container"></div>
|
||||
<template>
|
||||
<iframe src="test-document2-frame1.html" allowfullscreen="true" style="width: 100%; height: 200px; border: 1px solid #d8d8d8;"></iframe>
|
||||
<iframe src="test-document2-frame1.html" allowfullscreen="true" class="container"></iframe>
|
||||
</template>
|
||||
</y-test>
|
||||
|
||||
@ -74,10 +92,48 @@
|
||||
<y-description><iframe> element inside of a closed shadow DOM.</y-description>
|
||||
<div class="template-content-container"></div>
|
||||
<template>
|
||||
<iframe src="test-document2-frame1.html" allowfullscreen="true" style="width: 100%; height: 200px; border: 1px solid #d8d8d8;"></iframe>
|
||||
<iframe src="test-document2-frame1.html" allowfullscreen="true" class="container"></iframe>
|
||||
</template>
|
||||
</y-test>
|
||||
|
||||
<y-test>
|
||||
<y-description>SVG <img>.</y-description>
|
||||
<img src="test-document2-frame2.svg" class="container">
|
||||
</y-test>
|
||||
|
||||
<y-test>
|
||||
<y-description>SVG <object>.</y-description>
|
||||
<object data="test-document2-frame2.svg" type="image/svg+xml" class="container"></object>
|
||||
</y-test>
|
||||
|
||||
<y-test>
|
||||
<y-description>SVG <embed>.</y-description>
|
||||
<embed type="image/svg+xml" src="test-document2-frame2.svg" class="container">
|
||||
</y-test>
|
||||
|
||||
<y-test>
|
||||
<y-description>SVG <iframe>.</y-description>
|
||||
<iframe src="test-document2-frame2.svg" allowfullscreen="true" class="container"></iframe>
|
||||
</y-test>
|
||||
|
||||
<y-test>
|
||||
<y-description>SVG <svg>.</y-description>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="container" style="background-color: #f8f8f8;">
|
||||
<text
|
||||
x="7"
|
||||
y="12"
|
||||
style="
|
||||
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
font-size: 14px;
|
||||
fill: #000000;
|
||||
dominant-baseline: hanging;"
|
||||
>
|
||||
ありがとう
|
||||
</text>
|
||||
</svg>
|
||||
</y-test>
|
||||
|
||||
|
||||
<script>
|
||||
for (const element of document.querySelectorAll('y-test')) {
|
||||
setup(element);
|
||||
|
||||
Loading…
Reference in New Issue
Block a user