# 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
// 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/',
{
"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": {
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;
<form on:submit|preventDefault={handleFormSubmit} class="form-inline" action="details.html">
<input type="edit"
class="form-control form-control-sm mr-1"
- pattern="^[NWR]?[0-9]+$|.*openstreetmap.*"
+ pattern="^[NWRnwr]?[0-9]+$|.*openstreetmap.*"
value="{api_request_params.osmtype || ''}{api_request_params.osmid || ''}{api_request_params.place_id || ''}" />
<button type="submit" class="btn btn-primary btn-sm">Show</button>
</form>
<small class="form-text text-muted">
- OSM type+id (<em>N123</em>, <em>W123</em>, <em>R123</em>),
+ OSM type+id (<em>N123</em>, <em>n123</em>, <em>W123</em>, <em>w123</em>, <em>R123</em>, <em>r123</em>),
Place id (<em>1234</em>) or
URL (<em>https://openstreetmap.org/way/123</em>)
</small>
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) {
}
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'
--- /dev/null
+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'));
+ });
+});
--- /dev/null
+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');
+ });
+});
--- /dev/null
+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'));
+ });
+ });
+});
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');
+ });
+ });
});
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 () {
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'));
+ });
});
});
--- /dev/null
+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'));
+ });
+});