Merge pull request #17802 from calixteman/fix_tests

[Editor] Fix the rect used to click in some freetext integration tests
This commit is contained in:
calixteman 2024-03-19 10:50:34 +01:00 committed by GitHub
commit a142c8c945
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 59 additions and 26 deletions

View File

@ -61,11 +61,11 @@ class AnnotationEditorLayer {
#annotationLayer = null; #annotationLayer = null;
#boundPointerup = this.pointerup.bind(this); #boundPointerup = null;
#boundPointerdown = this.pointerdown.bind(this); #boundPointerdown = null;
#boundTextLayerPointerDown = this.#textLayerPointerDown.bind(this); #boundTextLayerPointerDown = null;
#editorFocusTimeoutId = null; #editorFocusTimeoutId = null;
@ -333,7 +333,8 @@ class AnnotationEditorLayer {
} }
enableTextSelection() { enableTextSelection() {
if (this.#textLayer?.div) { if (this.#textLayer?.div && !this.#boundTextLayerPointerDown) {
this.#boundTextLayerPointerDown = this.#textLayerPointerDown.bind(this);
this.#textLayer.div.addEventListener( this.#textLayer.div.addEventListener(
"pointerdown", "pointerdown",
this.#boundTextLayerPointerDown this.#boundTextLayerPointerDown
@ -343,11 +344,12 @@ class AnnotationEditorLayer {
} }
disableTextSelection() { disableTextSelection() {
if (this.#textLayer?.div) { if (this.#textLayer?.div && this.#boundTextLayerPointerDown) {
this.#textLayer.div.removeEventListener( this.#textLayer.div.removeEventListener(
"pointerdown", "pointerdown",
this.#boundTextLayerPointerDown this.#boundTextLayerPointerDown
); );
this.#boundTextLayerPointerDown = null;
this.#textLayer.div.classList.remove("highlighting"); this.#textLayer.div.classList.remove("highlighting");
} }
} }
@ -385,13 +387,23 @@ class AnnotationEditorLayer {
} }
enableClick() { enableClick() {
if (this.#boundPointerdown) {
return;
}
this.#boundPointerdown = this.pointerdown.bind(this);
this.#boundPointerup = this.pointerup.bind(this);
this.div.addEventListener("pointerdown", this.#boundPointerdown); this.div.addEventListener("pointerdown", this.#boundPointerdown);
this.div.addEventListener("pointerup", this.#boundPointerup); this.div.addEventListener("pointerup", this.#boundPointerup);
} }
disableClick() { disableClick() {
if (!this.#boundPointerdown) {
return;
}
this.div.removeEventListener("pointerdown", this.#boundPointerdown); this.div.removeEventListener("pointerdown", this.#boundPointerdown);
this.div.removeEventListener("pointerup", this.#boundPointerup); this.div.removeEventListener("pointerup", this.#boundPointerup);
this.#boundPointerdown = null;
this.#boundPointerup = null;
} }
attach(editor) { attach(editor) {
@ -821,6 +833,8 @@ class AnnotationEditorLayer {
for (const editor of this.#uiManager.getEditors(this.pageIndex)) { for (const editor of this.#uiManager.getEditors(this.pageIndex)) {
this.add(editor); this.add(editor);
} }
// We're maybe rendering a layer which was invisible when we started to edit
// so we must set the different callbacks for it.
this.updateMode(); this.updateMode();
} }
@ -833,6 +847,7 @@ class AnnotationEditorLayer {
// issues (see #15582), we must commit the current one before changing // issues (see #15582), we must commit the current one before changing
// the viewport. // the viewport.
this.#uiManager.commitOrRemove(); this.#uiManager.commitOrRemove();
this.#cleanup();
const oldRotation = this.viewport.rotation; const oldRotation = this.viewport.rotation;
const rotation = viewport.rotation; const rotation = viewport.rotation;
@ -843,7 +858,7 @@ class AnnotationEditorLayer {
editor.rotate(rotation); editor.rotate(rotation);
} }
} }
this.updateMode(); this.addInkEditorIfNeeded(/* isCommitting = */ false);
} }
/** /**

View File

@ -444,15 +444,16 @@ describe("FreeText Editor", () => {
await clearAll(page); await clearAll(page);
const editorSelector = getEditorSelector(9);
await page.mouse.click(rect.x + 200, rect.y + 100); await page.mouse.click(rect.x + 200, rect.y + 100);
await page.waitForSelector(getEditorSelector(9), { await page.waitForSelector(editorSelector, {
visible: true, visible: true,
}); });
for (let i = 0; i < 5; i++) { for (let i = 0; i < 5; i++) {
await page.type(`${getEditorSelector(9)} .internal`, "A"); await page.type(`${editorSelector} .internal`, "A");
const editorRect = await page.$eval(getEditorSelector(9), el => { const editorRect = await page.$eval(editorSelector, el => {
const { x, y, width, height } = el.getBoundingClientRect(); const { x, y, width, height } = el.getBoundingClientRect();
return { x, y, width, height }; return { x, y, width, height };
}); });
@ -462,9 +463,7 @@ describe("FreeText Editor", () => {
editorRect.x + 1.5 * editorRect.width, editorRect.x + 1.5 * editorRect.width,
editorRect.y editorRect.y
); );
await page.waitForSelector( await page.waitForSelector(`${editorSelector} .overlay.enabled`);
`${getEditorSelector(9)} .overlay.enabled`
);
if (i < 4) { if (i < 4) {
// And select it again. // And select it again.
@ -474,13 +473,13 @@ describe("FreeText Editor", () => {
{ count: 2 } { count: 2 }
); );
await page.waitForSelector( await page.waitForSelector(
`${getEditorSelector(9)} .overlay:not(.enabled)` `${editorSelector} .overlay:not(.enabled)`
); );
} }
} }
let prevText = await page.$eval( let prevText = await page.$eval(
`${getEditorSelector(9)} .internal`, `${editorSelector} .internal`,
el => el.innerText el => el.innerText
); );
@ -489,10 +488,10 @@ describe("FreeText Editor", () => {
(prev, sel) => document.querySelector(sel).innerText !== prev, (prev, sel) => document.querySelector(sel).innerText !== prev,
{}, {},
previous, previous,
`${getEditorSelector(9)} .internal` `${editorSelector} .internal`
); );
const getText = () => const getText = () =>
page.$eval(`${getEditorSelector(9)} .internal`, el => el.innerText); page.$eval(`${editorSelector} .internal`, el => el.innerText);
// We're in the middle of the text. // We're in the middle of the text.
await kbUndo(page); await kbUndo(page);
@ -528,7 +527,7 @@ describe("FreeText Editor", () => {
); );
await kbRedo(page); await kbRedo(page);
await page.waitForSelector(getEditorSelector(9), { await page.waitForSelector(editorSelector, {
visible: true, visible: true,
}); });
@ -536,7 +535,7 @@ describe("FreeText Editor", () => {
expect(text).withContext(`In ${browserName}`).toEqual("A"); expect(text).withContext(`In ${browserName}`).toEqual("A");
// Add a new A. // Add a new A.
const editorRect = await page.$eval(getEditorSelector(9), el => { let editorRect = await page.$eval(editorSelector, el => {
const { x, y, width, height } = el.getBoundingClientRect(); const { x, y, width, height } = el.getBoundingClientRect();
return { x, y, width, height }; return { x, y, width, height };
}); });
@ -545,17 +544,20 @@ describe("FreeText Editor", () => {
editorRect.y + editorRect.height / 2, editorRect.y + editorRect.height / 2,
{ count: 2 } { count: 2 }
); );
await page.waitForSelector( await page.waitForSelector(`${editorSelector} .overlay:not(.enabled)`);
`${getEditorSelector(9)} .overlay:not(.enabled)` await page.type(`${editorSelector} .internal`, "A");
);
await page.type(`${getEditorSelector(9)} .internal`, "A"); editorRect = await page.$eval(editorSelector, el => {
const { x, y, width, height } = el.getBoundingClientRect();
return { x, y, width, height };
});
// Commit. // Commit.
await page.mouse.click( await page.mouse.click(
editorRect.x + 1.5 * editorRect.width, editorRect.x + 1.5 * editorRect.width,
editorRect.y editorRect.y
); );
await page.waitForSelector(`${getEditorSelector(9)} .overlay.enabled`); await page.waitForSelector(`${editorSelector} .overlay.enabled`);
text = await getText(); text = await getText();
expect(text).withContext(`In ${browserName}`).toEqual("AA"); expect(text).withContext(`In ${browserName}`).toEqual("AA");
@ -2305,7 +2307,7 @@ describe("FreeText Editor", () => {
pages.map(async ([browserName, page]) => { pages.map(async ([browserName, page]) => {
await switchToFreeText(page); await switchToFreeText(page);
const rect = await page.$eval(".annotationEditorLayer", el => { let rect = await page.$eval(".annotationEditorLayer", el => {
const { x, y } = el.getBoundingClientRect(); const { x, y } = el.getBoundingClientRect();
return { x, y }; return { x, y };
}); });
@ -2322,7 +2324,15 @@ describe("FreeText Editor", () => {
`${getEditorSelector(0)} .overlay.enabled` `${getEditorSelector(0)} .overlay.enabled`
); );
await page.mouse.click(rect.x + 110, rect.y + 150); rect = await page.$eval(getEditorSelector(0), el => {
const { x, y, width, height } = el.getBoundingClientRect();
return { x, y, width, height };
});
await page.mouse.click(
rect.x + 5 * rect.width,
rect.y + 5 * rect.height
);
await page.waitForSelector(getEditorSelector(1), { await page.waitForSelector(getEditorSelector(1), {
visible: true, visible: true,
}); });
@ -2334,7 +2344,15 @@ describe("FreeText Editor", () => {
`${getEditorSelector(1)} .overlay.enabled` `${getEditorSelector(1)} .overlay.enabled`
); );
await page.mouse.click(rect.x + 111, rect.y + 151); rect = await page.$eval(getEditorSelector(0), el => {
const { x, y, width, height } = el.getBoundingClientRect();
return { x, y, width, height };
});
await page.mouse.click(
rect.x + 5 * rect.width,
rect.y + 5 * rect.height
);
await waitForSelectedEditor(page, getEditorSelector(1)); await waitForSelectedEditor(page, getEditorSelector(1));
const pos = n => const pos = n =>