From: Sarah Hoffmann Date: Thu, 13 May 2021 12:53:05 +0000 (+0200) Subject: Merge remote-tracking branch 'upstream/master' X-Git-Url: https://git.openstreetmap.org/nominatim-ui.git/commitdiff_plain/a4d91ff557a71d80f997b03b213acf1664e64ace?hp=334237778713f039f8d079251578b4c8f9b20645 Merge remote-tracking branch 'upstream/master' --- diff --git a/CHANGES.md b/CHANGES.md index 929b9e8..073e097 100644 --- a/CHANGES.md +++ b/CHANGES.md @@ -1,5 +1,13 @@ # CHANGES +* version 3.1.0 - 2021-04-26 + + * Configuration: new options to set API endpoint headers and additional paramters, thanks petoc + * Test suite: New test suite using a headless browser for UI interaction, thanks darkshredder + * Fix: Links to API URL weren't displayed after a search + * Fix: On result pages the map icons were not cleared between searches (caching issue) + * Fix: On reverse page switching empty coordinates no longer leads to string 'null' searches + * version 3.0.5 - 2021-04-14 * Details page: better indicate places having no name, thanks darkshredder diff --git a/dist/config.defaults.js b/dist/config.defaults.js index 9ab6f3a..ccbddfc 100644 --- a/dist/config.defaults.js +++ b/dist/config.defaults.js @@ -6,6 +6,12 @@ let Nominatim_Config = { // Where Nominatim API runs. Remember to add port if needed and trailing slash. Nominatim_API_Endpoint: 'http://localhost/nominatim/', + // Additional request headers for Nominatim API. + Nominatim_API_Endpoint_Headers: {}, + + // Additional query parameters for Nominatim API. + Nominatim_API_Endpoint_Params: {}, + // relative path or full URL Images_Base_Url: 'mapicons/', diff --git a/package.json b/package.json index 57df23c..9a9c082 100644 --- a/package.json +++ b/package.json @@ -1,13 +1,13 @@ { "name": "nominatim-ui", "description": "Debug web interface for Nominatim geocoder", - "version": "3.0.5", + "version": "3.1.0", "license": "GPL-2.0", "scripts": { "build": "rollup -c", "dev": "rollup -c -w", "lint": "eslint --quiet .*.js src/ test/", - "test": "mocha --recursive test/", + "test": "rollup -c && mocha --recursive test/", "start": "static-server dist" }, "devDependencies": { diff --git a/src/components/LastUpdated.svelte b/src/components/LastUpdated.svelte index 44738f2..f03e8cd 100644 --- a/src/components/LastUpdated.svelte +++ b/src/components/LastUpdated.svelte @@ -11,6 +11,12 @@ last_api_request_url_store.subscribe(url => { last_api_request_url = url; + if (last_api_request_url) { + last_api_request_url = new URL(last_api_request_url); + last_api_request_url.searchParams.delete('polygon_geojson'); + last_api_request_url = last_api_request_url.toString(); + } + if (fetch_running || last_updated_date) return; fetch_running = true; diff --git a/src/components/SearchSectionDetails.svelte b/src/components/SearchSectionDetails.svelte index 8029fb3..cd5faac 100644 --- a/src/components/SearchSectionDetails.svelte +++ b/src/components/SearchSectionDetails.svelte @@ -27,12 +27,12 @@
- OSM type+id (N123, W123, R123), + OSM type+id (N123, n123, W123, w123, R123, r123), Place id (1234) or URL (https://openstreetmap.org/way/123) diff --git a/src/lib/api_utils.js b/src/lib/api_utils.js index 9dff877..eb2a549 100644 --- a/src/lib/api_utils.js +++ b/src/lib/api_utils.js @@ -14,7 +14,7 @@ export async function fetch_from_api(endpoint_name, params, callback) { if (endpoint_name !== 'status') last_api_request_url_store.set(null); try { - await fetch(api_url) + await fetch(api_url, { headers: Nominatim_Config.Nominatim_API_Endpoint_Headers || {} }) .then(response => response.json()) .then(data => { if (data.error) { @@ -57,12 +57,19 @@ export async function fetch_content_into_element(url, dom_element) { } function generate_nominatim_api_url(endpoint_name, params) { + extend_parameters(params, Nominatim_Config.Nominatim_API_Endpoint_Params); return Nominatim_Config.Nominatim_API_Endpoint + endpoint_name + '.php?' + Object.keys(clean_up_parameters(params)).map((k) => { return encodeURIComponent(k) + '=' + encodeURIComponent(params[k]); }).join('&'); } +function extend_parameters(params, params2) { + var param_names = Object.keys(params2); + for (var i = 0; i < param_names.length; i += 1) { + params[param_names[i]] = params2[param_names[i]]; + } +} function clean_up_parameters(params) { // `&a=&b=&c=1` => '&c=1' diff --git a/test/about.js b/test/about.js new file mode 100644 index 0000000..de004ab --- /dev/null +++ b/test/about.js @@ -0,0 +1,21 @@ +const assert = require('assert'); + +describe('About Page', function () { + let page; + + before(async function () { + page = await browser.newPage(); + await page.goto('http://localhost:9999/about.html'); + }); + + after(async function () { + await page.close(); + }); + + it('should contain Nominatim description', async function () { + await page.waitForSelector('#about-help'); + let description = await page.$eval('#about-help', el => el.textContent); + + assert.ok(description.includes('Nominatim is a search engine')); + }); +}); diff --git a/test/browser.js b/test/browser.js new file mode 100644 index 0000000..078cc62 --- /dev/null +++ b/test/browser.js @@ -0,0 +1,10 @@ +const assert = require('assert'); + +describe('Browser behaviour', function () { + + it('should have a user-agent', async function () { + let user_agent = await browser.userAgent(); + assert.strictEqual(user_agent, + 'Nominatim UI test suite Mozilla/5.0 Gecko/20100101 HeadlessChrome/90.0'); + }); +}); diff --git a/test/details.js b/test/details.js new file mode 100644 index 0000000..5baf402 --- /dev/null +++ b/test/details.js @@ -0,0 +1,82 @@ +const assert = require('assert'); + +describe('Details Page', function () { + let page; + + describe('No search', function () { + before(async function () { + page = await browser.newPage(); + await page.goto('http://localhost:9999/details.html'); + }); + + after(async function () { + await page.close(); + }); + + it('should have a HTML page title', async function () { + assert.equal(await page.title(), 'Nominatim Demo'); + }); + }); + + describe('With search', function () { + before(async function () { + page = await browser.newPage(); + await page.goto('http://localhost:9999/details.html'); + await page.type('input[type=edit]', 'W5013364'); + await page.click('button[type=submit]'); + await page.waitForSelector('.container .row'); + }); + + after(async function () { + await page.close(); + }); + + it('should have header title as Eiffel Tower', async function () { + let page_header = await page.$eval('.container h1', el => el.textContent); + + assert.ok(page_header.includes('Eiffel Tower')); + }); + + it('should have link to https://www.openstreetmap.org/way/5013364', async function () { + + assert.strictEqual((await page.$$('a[href="https://www.openstreetmap.org/way/5013364"]')).length, 1); + }); + + it('should change page url and add new header on clicking display keywords', async function () { + let current_url; + let display_headers; + let [display_keywords_btn] = await page.$x("//a[contains(text(), 'display keywords')]"); + + await display_keywords_btn.click(); + await page.waitForNavigation(); + + current_url = new URL(await page.url()); + assert.strictEqual(current_url.searchParams.get('keywords'), '1'); + + await page.waitForSelector('h3'); + display_headers = await page.$$eval('h3', elements => elements.map(el => el.textContent)); + assert.deepStrictEqual(display_headers, ['Name Keywords', 'Address Keywords']); + }); + + it('should change page url on clicking display child places', async function () { + let current_url; + let [child_places_btn] = await page.$x("//a[contains(text(), 'display child places')]"); + + await child_places_btn.click(); + await page.waitForNavigation(); + + current_url = new URL(await page.url()); + assert.strictEqual(current_url.searchParams.get('hierarchy'), '1'); + }); + + it('should have case-insenstive input and can navigate to other details', async function () { + let input_field = await page.$('input[type=edit]'); + await input_field.click({ clickCount: 3 }); + await input_field.type('w375257537'); + await page.click('button[type=submit]'); + + await page.waitForSelector('a[href="https://www.openstreetmap.org/way/375257537"]'); + assert.ok((await page.$eval('.container h1', el => el.textContent)).includes('Taj Mahal')); + }); + }); +}); diff --git a/test/reverse.js b/test/reverse.js index 8e02b23..09e9f36 100644 --- a/test/reverse.js +++ b/test/reverse.js @@ -33,4 +33,42 @@ describe('Reverse Page', function () { assert.equal(await lon_handle.evaluate(node => node.value), 5); }); }); + + describe('With search', function () { + before(async function () { + page = await browser.newPage(); + await page.goto('http://localhost:9999/reverse.html'); + await page.type('input[name=lat]', '27.1750090510034'); + await page.type('input[name=lon]', '78.04209025'); + await page.click('button[type=submit]'); + await page.waitForSelector('#searchresults'); + }); + + after(async function () { + await page.close(); + }); + + it('should return single result', async function () { + let results_count = await page.$$eval('#searchresults .result', elements => elements.length); + + assert.deepStrictEqual(results_count, 1); + }); + + it('should display a map', async function () { + await page.waitForSelector('#map'); + assert.equal((await page.$$('#map')).length, 1); + }); + + it('should redirect to details page on clicking details button', async function () { + let current_url; + let results = await page.$$('#searchresults .result a'); + + await results[0].click(); + await page.waitForNavigation(); + + current_url = new URL(await page.url()); + + assert.deepStrictEqual(current_url.pathname, '/details.html'); + }); + }); }); diff --git a/test/search.js b/test/search.js index c6e6059..0e6ec9f 100644 --- a/test/search.js +++ b/test/search.js @@ -16,6 +16,44 @@ describe('Search Page', function () { it('should have a HTML page title', async function () { assert.equal(await page.title(), 'Nominatim Demo'); }); + + it('should have a welcome message', async function () { + let welcome_message = await page.$eval('#welcome h2', el => el.textContent); + assert.deepStrictEqual(welcome_message, 'Welcome to Nominatim'); + }); + + it('should have a last_updated_: ... ago data', async function () { + await page.waitForSelector('abbr[id="data-date"]'); + + let last_updated = await page.$eval('abbr[id="data-date"]', el => el.textContent); + assert.ok(last_updated.includes('ago')); + }); + + it('should show map bounds buttons', async function () { + await page.waitForSelector('#map'); + let show_map_pos_handle = await page.$('#show-map-position'); + let map_pos_handle = await page.$('#map-position'); + + await show_map_pos_handle.click(); + assert.strictEqual(await map_pos_handle.evaluate(node => node.style.display), 'block'); + + let map_pos_details = await page.$eval('#map-position-inner', el => el.textContent); + map_pos_details = map_pos_details.split(' \n'); + + let map_center_coor = map_pos_details[0] + .split('map center: ')[1].split(' view')[0].split(','); + let map_zoom = map_pos_details[1].split('map zoom: ')[1]; + let map_viewbox = map_pos_details[2].split('viewbox: ')[1].split(','); + let last_click = map_pos_details[3].split('last click: ')[1]; + + assert.deepStrictEqual(map_center_coor.length, 2); + assert.ok(map_zoom); + assert.deepStrictEqual(map_viewbox.length, 4); + assert.deepStrictEqual(last_click, 'undefined'); + + await page.click('#map-position-close a'); + assert.strictEqual(await map_pos_handle.evaluate(node => node.style.display), 'none'); + }); }); describe('Search for City of London', function () { @@ -36,14 +74,58 @@ describe('Search Page', function () { assert.equal(await page.title(), 'Result for City of London | Nominatim Demo'); }); + it('should have added search params', async function () { + let current_url = new URL(await page.url()); + assert.strictEqual(current_url.searchParams.get('q'), 'City of London'); + }); + + it('should atleast one result', async function () { + let results_count = await page.$$eval('#searchresults .result', elements => elements.length); + assert.ok(results_count > 1); + }); + + it('should have show more results button', async function () { + let [search_more_btn] = await page.$x("//a[contains(text(), 'Search for more results')]"); + assert.ok(search_more_btn); + }); + it('should display the API request and debug URL', async function () { let link_titles = await page.$$eval('#api-request a', links => links.map(l => l.innerHTML)); assert.deepEqual(link_titles, ['API request', 'debug output']); }); + it('should not have polygon params in API request and debug URL', async function () { + let links_href = await page.$$eval('#api-request a', links => links.map(l => l.href)); + let api_request_url = new URL(links_href[0]); + let debug_url = new URL(links_href[1]); + + assert.deepStrictEqual(api_request_url.searchParams.has('polygon_geojson'), false); + assert.deepStrictEqual(debug_url.searchParams.has('polygon_geojson'), false); + }); + it('should display a map', async function () { await page.waitForSelector('#map'); assert.equal((await page.$$('#map')).length, 1); }); + + it('should have polygon and marker in map and minimap', async function () { + assert.strictEqual((await page.$$('#map .leaflet-overlay-pane path')).length, 4); + }); + + it('should redirect to details page on clicking details button', async function () { + let current_url; + let page_header; + let results = await page.$$('#searchresults .result a'); + + await results[0].click(); + await page.waitForNavigation(); + + current_url = new URL(await page.url()); + assert.deepStrictEqual(current_url.pathname, '/details.html'); + + await page.waitForSelector('.container h1'); + page_header = await page.$eval('.container h1', el => el.textContent); + assert.ok(page_header.includes('City of London')); + }); }); }); diff --git a/test/status.js b/test/status.js new file mode 100644 index 0000000..b9fcea7 --- /dev/null +++ b/test/status.js @@ -0,0 +1,21 @@ +const assert = require('assert'); + +describe('Status Page', function () { + let page; + + before(async function () { + page = await browser.newPage(); + await page.goto('http://localhost:9999/status.html', { waitUntil: 'networkidle0' }); + }); + + after(async function () { + await page.close(); + }); + + it('should have software version', async function () { + let status_details = await page.$eval('body', + el => el.textContent.match(/Software version.*\d+\.\d+/)); + + assert.ok(!status_details[0].includes('undefined')); + }); +});