vjrj
82d0399c86
Síntoma: en staging /fires no pintaba teselas ni fuegos, no creaba la suscripción `activefiresmyloc` y se quedaba con "Actualizando…" para siempre. Se había atribuido a que el navegador de las pruebas no compone; no era eso. El mismo navegador pinta la portada, y pinta /fires perfectamente contra un servidor local. La diferencia era la clave de Google. `DefMapLayers` montaba el control de capas con dos capas base (OSM color y gris) y, cuando `Gkeys` resolvía la clave, volvía a renderizar añadiendo tres capas de Google. En esa segunda pasada react-leaflet se dejaba por el camino la capa base marcada, y el mapa se quedaba sin ninguna. En desarrollo no hay clave, así que la segunda pasada no añadía nada y el bug no se veía nunca. El control se monta ahora una sola vez, con la lista de capas ya cerrada, y con un tope de 5 s por si el script de Google no llega: las capas de Google son un extra, el mapa tiene que salir igual. Reproducido en local poniendo una clave falsa en settings-ci.json (0 teselas antes del arreglo, 15 después). Esa clave falsa se queda ahí a propósito, para que la suite e2e recorra el mismo camino que staging y producción, y e2e/tests/fires-map.spec.js lo fija: teselas, una única capa base marcada, suscripción por viewport, y que no se quede en "Actualizando…". 16 tests e2e en verde.
54 lines
2.4 KiB
JavaScript
54 lines
2.4 KiB
JavaScript
import { test, expect } from '@playwright/test';
|
|
import { waitForMap } from '../support/app.js';
|
|
|
|
// El mapa de /fires es la página principal del sitio y se quedaba EN GRIS en
|
|
// staging: ni teselas, ni fuegos, ni suscripción por viewport, con el
|
|
// "Actualizando…" eterno. Se había dado por un artefacto del navegador sin
|
|
// pantalla; no lo era. El control de capas se montaba con dos capas base y, al
|
|
// resolverse la clave de Google, se le añadían tres más — y en esa segunda
|
|
// pasada react-leaflet se dejaba por el camino la capa base marcada.
|
|
//
|
|
// Solo se veía en despliegues CON clave de Google. Por eso settings-ci.json
|
|
// lleva una clave falsa: para que esta suite recorra el mismo camino que
|
|
// staging y producción.
|
|
test.describe('mapa de fuegos activos', () => {
|
|
test('paints its tiles', async ({ page }) => {
|
|
await page.goto('/fires');
|
|
await waitForMap(page);
|
|
|
|
await expect(page.locator('.leaflet-tile-loaded').first()).toBeVisible({ timeout: 60000 });
|
|
expect(await page.locator('.leaflet-tile').count()).toBeGreaterThan(0);
|
|
});
|
|
|
|
test('offers every base layer and keeps the checked one', async ({ page }) => {
|
|
await page.goto('/fires');
|
|
await waitForMap(page);
|
|
|
|
const layers = page.locator('.leaflet-control-layers-base input');
|
|
expect(await layers.count()).toBeGreaterThanOrEqual(2);
|
|
// Exactamente una marcada, y el mapa con teselas: si la marcada se hubiera
|
|
// perdido, seguiría marcada en el control pero no habría teselas.
|
|
const checked = await page.locator('.leaflet-control-layers-base input:checked').count();
|
|
expect(checked).toEqual(1);
|
|
expect(await page.locator('.leaflet-tile').count()).toBeGreaterThan(0);
|
|
});
|
|
|
|
test('subscribes to the fires of the current viewport', async ({ page }) => {
|
|
await page.goto('/fires');
|
|
await waitForMap(page);
|
|
|
|
const names = await page.evaluate(() => Object.values(window.Meteor.connection._subscriptions).map(s => s.name));
|
|
expect(names).toContain('activefiresmyloc');
|
|
expect(names).toContain('activefiresunionmyloc');
|
|
});
|
|
|
|
test('does not get stuck on "Actualizando…"', async ({ page }) => {
|
|
await page.goto('/fires');
|
|
await waitForMap(page);
|
|
await page.waitForTimeout(5000);
|
|
|
|
// El texto aparece mientras la suscripción no está lista; quedarse ahí es
|
|
// justo el síntoma del mapa gris.
|
|
await expect(page.getByText('Actualizando...', { exact: false })).toHaveCount(0);
|
|
});
|
|
});
|