Merge pull request #17893 from timvandermeij/find-integration-test

Fix the "must highlight text in the right position" integration test
This commit is contained in:
Tim van der Meij 2024-04-11 14:10:01 +02:00 committed by GitHub
commit fcb76a78dd
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -39,35 +39,48 @@ describe("find bar", () => {
it("must highlight text in the right position", async () => { it("must highlight text in the right position", async () => {
await Promise.all( await Promise.all(
pages.map(async ([browserName, page]) => { pages.map(async ([browserName, page]) => {
// Highlight all occurrences of the letter A (case insensitive).
await page.click("#viewFind"); await page.click("#viewFind");
await page.waitForSelector("#viewFind", { hidden: false }); await page.waitForSelector("#viewFind", { hidden: false });
await page.type("#findInput", "a"); await page.type("#findInput", "a");
await page.click("#findHighlightAll"); await page.click("#findHighlightAll");
await page.waitForSelector(".textLayer .highlight"); await page.waitForSelector(".textLayer .highlight");
// The PDF has the text "AB BA" in a monospace font.
// Make sure we have the right number of highlighted divs. // The PDF file contains the text 'AB BA' in a monospace font on a
// single line. Check if the two occurrences of A are highlighted.
const highlights = await page.$$(".textLayer .highlight"); const highlights = await page.$$(".textLayer .highlight");
expect(highlights.length).withContext(`In ${browserName}`).toEqual(2); expect(highlights.length).withContext(`In ${browserName}`).toEqual(2);
const glyphWidth = 15.98; // From the PDF.
const pageDiv = await page.$(".page canvas"); // Normalize the highlight's height. The font data in the PDF sets the
const pageBox = await pageDiv.boundingBox(); // size of the glyphs (and therefore the size of the highlights), but
// the viewer applies extra padding to them. For the comparison we
// therefore use the unpadded, glyph-sized parent element's height.
const parentSpan = (await highlights[0].$$("xpath/.."))[0];
const parentBox = await parentSpan.boundingBox();
const firstA = await highlights[0].boundingBox(); const firstA = await highlights[0].boundingBox();
const secondA = await highlights[1].boundingBox(); const secondA = await highlights[1].boundingBox();
// Subtract the page offset from the text bounding boxes; firstA.height = parentBox.height;
firstA.x -= pageBox.x; secondA.height = parentBox.height;
firstA.y -= pageBox.y;
secondA.x -= pageBox.x; // Check if the vertical position of the highlights is correct. Both
secondA.y -= pageBox.y; // should be on a single line.
// They should be on the same line.
expect(firstA.y).withContext(`In ${browserName}`).toEqual(secondA.y); expect(firstA.y).withContext(`In ${browserName}`).toEqual(secondA.y);
// Check if the height of the two highlights is correct. Both should
// match the font size.
const fontSize = 26.66; // From the PDF. const fontSize = 26.66; // From the PDF.
// The highlighted text has more padding. fuzzyMatch(firstA.height, fontSize, browserName);
fuzzyMatch(firstA.height, fontSize + 5, browserName); fuzzyMatch(secondA.height, fontSize, browserName);
fuzzyMatch(secondA.height, fontSize + 5, browserName);
const expectedFirstAX = 28; // Check if the horizontal position of the highlights is correct. The
fuzzyMatch(firstA.x, expectedFirstAX, browserName); // second occurrence should be four glyph widths (three letters and
// The second 'A' should be 4 glyphs widths from the first. // one space) away from the first occurrence.
fuzzyMatch(secondA.x, expectedFirstAX + glyphWidth * 4, browserName); const pageDiv = await page.$(".page canvas");
const pageBox = await pageDiv.boundingBox();
const expectedFirstAX = 30; // From the PDF.
const glyphWidth = 15.98; // From the PDF.
fuzzyMatch(firstA.x, pageBox.x + expectedFirstAX, browserName);
fuzzyMatch(secondA.x, firstA.x + glyphWidth * 4, browserName);
}) })
); );
}); });