diff --git a/tests/end2end/playwright/base-layers.spec.js b/tests/end2end/playwright/base-layers.spec.js index f716bcb710..6c723dda73 100644 --- a/tests/end2end/playwright/base-layers.spec.js +++ b/tests/end2end/playwright/base-layers.spec.js @@ -1,7 +1,13 @@ // @ts-check +import * as path from 'path'; +import * as fs from 'fs/promises' +import { existsSync } from 'node:fs'; import { test, expect } from '@playwright/test'; import { gotoMap } from './globals'; +// To update MOCK files +const UPDATE_MOCK_FILES = false; + test.describe('Base layers', () => { const locale = 'en-US'; @@ -131,30 +137,57 @@ test.describe('Base layers', () => { await page.locator('#navbar button.btn.zoom-in').click(); await page.locator('#navbar button.btn.zoom-in').click(); // Wait for OL transition - await page.waitForTimeout(1000); + await page.waitForTimeout(500); // Catch osm tile let GetTiles = []; - await page.route('https://tile.openstreetmap.org/*/*/*.png', (route) => { - const request = route.request(); + await page.route('https://tile.openstreetmap.org/*/*/*.png', async (route) => { + const request = await route.request(); GetTiles.push(request.url()); - }, { times: 6 }); + + // Build path file in mock directory + const pathFile = path.join(__dirname, 'mock/base_layers/osm/tiles'+(new URL(request.url()).pathname)) + if (UPDATE_MOCK_FILES) { + // Save file in mock directory + const response = await route.fetch(); + await fs.mkdir(path.dirname(pathFile), { recursive: true }) + await fs.writeFile(pathFile, await response.body()) + } else if (existsSync(pathFile)) { + // fulfill route's request with mock file + route.fulfill({ + path: pathFile + }) + } else { + // continue + route.continue() + } + }) + // Select OSM await page.locator('#switcher-baselayer').getByRole('combobox').selectOption('osm-mapnik'); + // Wait for request and response while (GetTiles.length < 6) { await page.waitForTimeout(100); } - expect(GetTiles).toHaveLength(6); - expect(GetTiles[0]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) - expect(GetTiles[1]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) - expect(GetTiles[2]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) - expect(GetTiles[3]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) - expect(GetTiles[4]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) - expect(GetTiles[5]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) + + // Check that we catch 6 tiles + await expect(GetTiles).toHaveLength(6); + // Check that every tiles are from level 19 + await expect(GetTiles[0]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) + await expect(GetTiles[1]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) + await expect(GetTiles[2]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) + await expect(GetTiles[3]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) + await expect(GetTiles[4]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) + await expect(GetTiles[5]).toMatch(/\/19\/\d{6}\/\d{6}\.png/) + + // Remove listen to osm tiles await page.unroute('https://tile.openstreetmap.org/*/*/*.png') + // Wait for OL transition - await page.waitForTimeout(1000); + await page.waitForTimeout(500); + + // Build screenshot to check if tiles are well drawn buffer = await page.screenshot({clip:{x:950/2-380/2, y:600/2-380/2, width:380, height:380}}); const osmByteLength = buffer.byteLength; await expect(osmByteLength).toBeGreaterThan(blankByteLength); // 1286 @@ -163,7 +196,7 @@ test.describe('Base layers', () => { // back to empty await page.locator('#switcher-baselayer').getByRole('combobox').selectOption('empty'); - // Wai for OL transition + // Wait for OL transition await page.waitForTimeout(500); buffer = await page.screenshot({clip:{x:950/2-380/2, y:600/2-380/2, width:380, height:380}}); await expect(buffer.byteLength).toBe(blankByteLength); @@ -171,26 +204,59 @@ test.describe('Base layers', () => { // Catch ortho GetTile request //let getTileRequestPromise = page.waitForRequest(/Request=GetTile/); GetTiles = []; - await page.route('https://data.geopf.fr/wmts*', (route) => { - const request = route.request(); + await page.route('https://data.geopf.fr/wmts*', async (route) => { + const request = await route.request(); GetTiles.push(request.url()); - }, { times: 6 }); + + // Build path file in mock directory + const parameters = new URL(request.url()).searchParams; + const pathFile = path.join( + __dirname, + 'mock/base_layers/geopf', + (parameters.get('layer') ?? 'ORTHOIMAGERY.ORTHOPHOTOS').replace('.', '_'), + parameters.get('TileMatrix') ?? '19', + parameters.get('TileRow') ?? '191427', + (parameters.get('TileCol') ?? '267786') +'.jpg', + ) + if (UPDATE_MOCK_FILES) { + // Save file in mock directory + const response = await route.fetch(); + await fs.mkdir(path.dirname(pathFile), { recursive: true }) + await fs.writeFile(pathFile, await response.body()) + } else if (existsSync(pathFile)) { + // fulfill route's request with mock file + route.fulfill({ + path: pathFile + }) + } else { + // continue + route.continue() + } + }); // Select ortho photos await page.locator('#switcher-baselayer').getByRole('combobox').selectOption('ign-photo'); // Wait for request and response while (GetTiles.length < 6) { - await page.waitForTimeout(500); + await page.waitForTimeout(100); } - expect(GetTiles).toHaveLength(6); - expect(GetTiles[0]).toContain('TileMatrix=19') - expect(GetTiles[1]).toContain('TileMatrix=19') - expect(GetTiles[2]).toContain('TileMatrix=19') - expect(GetTiles[3]).toContain('TileMatrix=19') - expect(GetTiles[4]).toContain('TileMatrix=19') - expect(GetTiles[5]).toContain('TileMatrix=19') + + // Check that we catch 6 tiles + await expect(GetTiles).toHaveLength(6); + // Check that every tiles are from level 19 + await expect(GetTiles[0]).toContain('TileMatrix=19') + await expect(GetTiles[1]).toContain('TileMatrix=19') + await expect(GetTiles[2]).toContain('TileMatrix=19') + await expect(GetTiles[3]).toContain('TileMatrix=19') + await expect(GetTiles[4]).toContain('TileMatrix=19') + await expect(GetTiles[5]).toContain('TileMatrix=19') + + // Remove listen to geopf tiles await page.unroute('https://data.geopf.fr/wmts*') + // Wait for OL transition - await page.waitForTimeout(1000); + await page.waitForTimeout(500); + + // Build screenshot to check if tiles are well drawn buffer = await page.screenshot({clip:{x:950/2-380/2, y:600/2-380/2, width:380, height:380}}); await expect(buffer.byteLength).toBeGreaterThan(blankByteLength); // 1286 await expect(buffer.byteLength).toBeGreaterThan(osmByteLength); // 67587 diff --git a/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267785.jpg b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267785.jpg new file mode 100644 index 0000000000..b626b46519 Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267785.jpg differ diff --git a/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267786.jpg b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267786.jpg new file mode 100644 index 0000000000..e8eeff1dcc Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267786.jpg differ diff --git a/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267787.jpg b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267787.jpg new file mode 100644 index 0000000000..452e72d03f Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191427/267787.jpg differ diff --git a/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267785.jpg b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267785.jpg new file mode 100644 index 0000000000..8500d6090a Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267785.jpg differ diff --git a/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267786.jpg b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267786.jpg new file mode 100644 index 0000000000..a4df0ede83 Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267786.jpg differ diff --git a/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267787.jpg b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267787.jpg new file mode 100644 index 0000000000..8e7168477f Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/geopf/ORTHOIMAGERY_ORTHOPHOTOS/19/191428/267787.jpg differ diff --git a/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267785/191427.png b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267785/191427.png new file mode 100644 index 0000000000..c8f1162582 Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267785/191427.png differ diff --git a/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267785/191428.png b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267785/191428.png new file mode 100644 index 0000000000..25c7b1d3c6 Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267785/191428.png differ diff --git a/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267786/191427.png b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267786/191427.png new file mode 100644 index 0000000000..aa0ba4eaa4 Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267786/191427.png differ diff --git a/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267786/191428.png b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267786/191428.png new file mode 100644 index 0000000000..f961bd2b24 Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267786/191428.png differ diff --git a/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267787/191427.png b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267787/191427.png new file mode 100644 index 0000000000..f1e68809fc Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267787/191427.png differ diff --git a/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267787/191428.png b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267787/191428.png new file mode 100644 index 0000000000..b3ed268a61 Binary files /dev/null and b/tests/end2end/playwright/mock/base_layers/osm/tiles/19/267787/191428.png differ