Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Bugfix] Still support bbox parameter #4513

Merged
merged 3 commits into from
Jul 4, 2024
Merged

[Bugfix] Still support bbox parameter #4513

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
de91a53
Tests e2e playwright: Catching errors
rldhont Jul 4, 2024
6d63d2a
[Bugfix] Still support bbox parameter
rldhont Jun 11, 2024
2f9bc77
[Bugfix] Projects in map: click on project image stay at the same extent
rldhont Jul 4, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 21 additions & 4 deletions assets/src/legacy/map.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -668,22 +668,39 @@ window.lizMap = function() {
// get projection
var proj = config.options.projection;
var projection = new OpenLayers.Projection(proj.ref);
var proj4326 = new OpenLayers.Projection('EPSG:4326');
var initialExtentProj = proj4326;
var zoomToClosest = false;

// get and define the max extent
var bbox = config.options.bbox;
var extent = new OpenLayers.Bounds(Number(bbox[0]),Number(bbox[1]),Number(bbox[2]),Number(bbox[3]));

var restrictedExtent = extent.scale(3);

const urlParameters = (new URL(document.location)).searchParams;
if (urlParameters.has('bbox')) {
let initialExtentParam = urlParameters.get('bbox').split(',');
if (initialExtentParam.length === 4) {
initialExtent = initialExtentParam;
}
if (urlParameters.has('crs')) {
initialExtentProj = new OpenLayers.Projection(urlParameters.get('crs'));
}
zoomToClosest = true;
}

let initialExtentPermalink = window.location.hash.substring(1).split('|')[0].split(',');
if (initialExtentPermalink.length === 4) {
initialExtent = initialExtentPermalink;
initialExtentProj = proj4326;
zoomToClosest = true;
}

if(initialExtent){
initialExtent = new OpenLayers.Bounds(initialExtent);
initialExtent.transform(new OpenLayers.Projection('EPSG:4326'), projection);
}else{
initialExtent.transform(initialExtentProj, projection);
} else {
initialExtent = extent.clone();
if ( 'initialExtent' in config.options && config.options.initialExtent.length == 4 ) {
var initBbox = config.options.initialExtent;
Expand Down Expand Up @@ -739,6 +756,7 @@ window.lizMap = function() {
,maxExtent:extent
,restrictedExtent: restrictedExtent
,initialExtent:initialExtent
,zoomToClosest: zoomToClosest
,maxScale: scales.length == 0 ? config.options.minScale : "auto"
,minScale: scales.length == 0 ? config.options.maxScale : "auto"
,numZoomLevels: scales.length == 0 ? config.options.zoomLevelNumber : scales.length
Expand Down Expand Up @@ -3805,8 +3823,7 @@ window.lizMap = function() {
// initialize the map
// Set map extent depending on options
if (!map.getCenter()) {
const zoomToClosest = window.location.hash.substring(1).split('|')[0].split(',').length === 4;
map.zoomToExtent(map.initialExtent, zoomToClosest);
map.zoomToExtent(map.initialExtent, map.zoomToClosest);
}

updateContentSize();
Expand Down
24 changes: 22 additions & 2 deletions assets/src/modules/Permalink.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -206,11 +206,31 @@ export default class Permalink {
const selectEmbedPermalink = document.getElementById('select-embed-permalink');
const inputEmbedPermalink = document.getElementById('input-embed-permalink');

var searchParams = {
repository: globalThis['lizUrls'].params.repository,
project: globalThis['lizUrls'].params.project
};
if (this._hash === '') {
const urlParameters = (new URL(window.location)).searchParams;
if (urlParameters.has('bbox')) {
searchParams['bbox'] = urlParameters.get('bbox');
}
if (urlParameters.has('crs')) {
searchParams['crs'] = urlParameters.get('crs');
}
}

const permalinkValue = window.location.origin
+ window.location.pathname
+ '?'
+ new URLSearchParams(searchParams)
+ this._hash;

if (inputSharePermalink) {
inputSharePermalink.value = window.location.href;
inputSharePermalink.value = permalinkValue;
}
if (permalink) {
permalink.href = window.location.href;
permalink.href = permalinkValue;
}
if (selectEmbedPermalink) {
const iframeSize = selectEmbedPermalink.value;
Expand Down
8 changes: 4 additions & 4 deletions lizmap/modules/view/templates/map_projects.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
<div id="projects">
<div id="map-projects">
{zone 'view~main_view', array('excludedProject'=>$excludedProject)}
<script>
{literal}
$(document).ready(function () {
$('#projects .thumbnail a.liz-project-show-desc').each(function(i,e){$(e).attr('onclick','');});
$('#projects .thumbnail a.liz-project-show-desc').click(function(){
$('#map-projects .thumbnail a.liz-project-show-desc').each(function(i,e){$(e).attr('onclick','');});
$('#map-projects .thumbnail a.liz-project-show-desc').click(function(){
var self = $(this);
var href = self.attr('href');
href = href.replace('link-projet-','liz-project-modal-');
Expand All @@ -26,7 +26,7 @@
});
return false;
});
$('#projects .thumbnail a.liz-project-view').click(function(){
$('#map-projects .thumbnail a.liz-project-view').click(function(){
var self = $(this);
var desc = self.parent().parent().find('.liz-project-desc');
var proj = desc.find('span.proj').text();
Expand Down
24 changes: 12 additions & 12 deletions lizmap/modules/view/templates/view.tpl
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,18 +14,18 @@
<a name="link-projet-{$idm}"></a>
<div class="thumbnail">
<div class="liz-project">
<a href="{$p->url}{if $hide_header}&h=0{/if}">
<img width="250" height="250" loading="lazy" src="{$p->img}" alt="project image" class="_liz-project-img">
<p class="liz-project-desc" >
<b class="title">{$p->title}</b>
<br/>
<br/><b>{@default.project.abstract.label@}</b>&nbsp;: <span class="abstract">{$p->abstract|strip_tags|truncate:100}</span>
<br/>
<br/><b>{@default.project.keywordList.label@}</b>&nbsp;: <span class="keywordList">{$p->keywordList}</span>
<br/>
<br/><b>{@default.project.projection.label@}</b>&nbsp;: <span class="proj">{$p->proj}</span>
<br/><b>{@default.project.bbox.label@}</b>&nbsp;: <span class="bbox">{$p->bbox}</span>
</p>
<a class="liz-project-view" href="{$p->url}{if $hide_header}&h=0{/if}">
<img width="250" height="250" loading="lazy" src="{$p->img}" alt="project image" class="_liz-project-img">
<p class="liz-project-desc" >
<b class="title">{$p->title}</b>
<br/>
<br/><b>{@default.project.abstract.label@}</b>&nbsp;: <span class="abstract">{$p->abstract|strip_tags|truncate:100}</span>
<br/>
<br/><b>{@default.project.keywordList.label@}</b>&nbsp;: <span class="keywordList">{$p->keywordList}</span>
<br/>
<br/><b>{@default.project.projection.label@}</b>&nbsp;: <span class="proj">{$p->proj}</span>
<br/><b>{@default.project.bbox.label@}</b>&nbsp;: <span class="bbox">{$p->bbox}</span>
</p>
</a>
</div>
<h5 class="liz-project-title">{$p->title}</h5>
Expand Down
73 changes: 41 additions & 32 deletions tests/end2end/playwright/error-occurred.spec.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,56 +2,65 @@
import { test, expect } from '@playwright/test';
const { gotoMap } = require('./globals')

test.describe('Error occurred', () => {
export async function goBackHomeAfterError(page) {
await page.getByRole('link', { name: 'Go back to the home page.' }).click();
const checked_url = new URL(page.url());
expect(checked_url.pathname).toBe('/');
}

// test('Loading map with an error', async ({ page }) => {
// const url = '/index.php/view/map/?repository=testsrepository&project=invalid_layer';
// await gotoMap(url, page, false);
// })
test.describe('Error occurred', () => {

test('Loading map without an error', async ({ page }) => {
const url = '/index.php/view/map/?repository=testsrepository&project=attribute_table';
await gotoMap(url, page);
test('Loading map with an error', async ({ page }) => {
const url = '/index.php/view/map/?repository=testsrepository&project=invalid_layer';
// Error catch
await gotoMap(url, page, false);
// Go back home
await goBackHomeAfterError(page);
})

test('Project config', async ({ page }) => {
test('Project error', async ({ page }) => {
await page.route('**/service/getProjectConfig*', async route => {
await route.abort()
});
await page.goto('/index.php/view/map/?repository=testsrepository&project=world-3857', { waitUntil: 'networkidle' });
expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toBeVisible();
await page.getByRole('link', { name: 'Go back to the home page.' }).click();
const checked_url = new URL(page.url());
expect(checked_url.pathname).toBe('/');
// Error catch
await gotoMap('/index.php/view/map/?repository=testsrepository&project=world-3857', page, false);
// Go back home
await goBackHomeAfterError(page);
})
test('GetCapabilities WMS', async ({ page }) => {

test('GetCapabilities WMS error', async ({ page }) => {
await page.route(/SERVICE=WMS&REQUEST=GetCapabilities/, async route => {
await route.abort()
});
await page.goto('/index.php/view/map/?repository=testsrepository&project=world-3857', { waitUntil: 'networkidle' });
expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toBeVisible();
await page.getByRole('link', { name: 'Go back to the home page.' }).click();
const checked_url = new URL(page.url());
expect(checked_url.pathname).toBe('/');
// Error catch
await gotoMap('/index.php/view/map/?repository=testsrepository&project=world-3857', page, false);
// Go back home
await goBackHomeAfterError(page);
})
test('GetCapabilities WMTS', async ({ page }) => {

test('GetCapabilities WMTS error', async ({ page }) => {
await page.route(/SERVICE=WMTS&REQUEST=GetCapabilities/, async route => {
await route.abort()
});
await page.goto('/index.php/view/map/?repository=testsrepository&project=world-3857', { waitUntil: 'networkidle' });
expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toBeVisible();
await page.getByRole('link', { name: 'Go back to the home page.' }).click();
const checked_url = new URL(page.url());
expect(checked_url.pathname).toBe('/');
// Error catch
await gotoMap('/index.php/view/map/?repository=testsrepository&project=world-3857', page, false);
// Go back home
await goBackHomeAfterError(page);
})
test('GetCapabilities WFS', async ({ page }) => {

test('GetCapabilities WFS error', async ({ page }) => {
await page.route(/SERVICE=WFS&REQUEST=GetCapabilities/, async route => {
await route.abort()
});
await page.goto('/index.php/view/map/?repository=testsrepository&project=world-3857', { waitUntil: 'networkidle' });
expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toBeVisible();
await page.getByRole('link', { name: 'Go back to the home page.' }).click();
const checked_url = new URL(page.url());
expect(checked_url.pathname).toBe('/');
// Error catch
await gotoMap('/index.php/view/map/?repository=testsrepository&project=world-3857', page, false);
// Go back home
await goBackHomeAfterError(page);
})

test('Loading map without an error', async ({ page }) => {
const url = '/index.php/view/map/?repository=testsrepository&project=attribute_table';
await gotoMap(url, page);
})

})
66 changes: 55 additions & 11 deletions tests/end2end/playwright/globals.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,70 @@
// @ts-check
const { expect } = require('@playwright/test');

async function NoErrors(page) {
// No error
await expect(page.locator('p.error-msg')).toHaveCount(0);
await expect(page.locator('#switcher lizmap-treeview ul li')).not.toHaveCount(0);
// Check no error message displayed
await expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toHaveCount(0);
}

async function CatchErrors(page) {
// Error
await expect(page.locator('p.error-msg')).toHaveCount(1);
await expect(page.locator('#switcher lizmap-treeview ul li')).toHaveCount(0);
// Error message displayed
await expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toBeVisible();
// Go back home link
await expect(page.getByRole('link', { name: 'Go back to the home page.' })).toHaveCount(1);
}

export async function gotoMap(url, page, check = true) {
// TODO keep this function synchronized with the Cypress equivalent

// Wait for WMS GetCapabilities promise
let getCapabilitiesWMSPromise = page.waitForRequest(/SERVICE=WMS&REQUEST=GetCapabilities/);
// Wait for WMS GetLegendGraphic promise
const getLegendGraphicPromise = page.waitForRequest(request => request.method() === 'POST' && request.postData() != null && request.postData()?.includes('GetLegendGraphic') === true);
await page.goto(url);

if (!check) {
expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toHaveCount(1);
// Wait for WMS GetCapabilities
await getCapabilitiesWMSPromise;
if (check) {
// Wait for WMS GetLegendGraphic promise
const getLegendGraphicPromise = page.waitForRequest(request => request.method() === 'POST' && request.postData() != null && request.postData()?.includes('GetLegendGraphic') === true);
// Normal check about the map
// Wait for WMS GetLegendGraphic
await getLegendGraphicPromise;
// No error
await NoErrors(page);
// Wait to be sure the map is ready
await page.waitForTimeout(1000)
} else {
// Error
await CatchErrors(page);
}
// Normal check about the map
}

export async function reloadMap(page, check = true) {
// TODO keep this function synchronized with the Cypress equivalent

// Wait for WMS GetCapabilities promise
let getCapabilitiesWMSPromise = page.waitForRequest(/SERVICE=WMS&REQUEST=GetCapabilities/);
await page.reload();

// Wait for WMS GetCapabilities
await getCapabilitiesWMSPromise;
// Wait for WMS GetLegendGraphic
await getLegendGraphicPromise;
// Check no error message displayed
expect(page.getByText('An error occurred while loading this map. Some necessary resources may temporari')).toHaveCount(0);
// Wait to be sure the map is ready
await page.waitForTimeout(1000)
if (check) {
// Wait for WMS GetLegendGraphic promise
const getLegendGraphicPromise = page.waitForRequest(request => request.method() === 'POST' && request.postData() != null && request.postData()?.includes('GetLegendGraphic') === true);
// Normal check about the map
// Wait for WMS GetLegendGraphic
await getLegendGraphicPromise;
// No error
await NoErrors(page);
// Wait to be sure the map is ready
await page.waitForTimeout(1000)
} else {
// Error
await CatchErrors(page);
}
}
Loading
Loading