From 5a4a84b843e42c5c6878737c5a8301271b0b29c0 Mon Sep 17 00:00:00 2001 From: Cole Hansen Date: Thu, 27 Jul 2017 15:27:58 -0400 Subject: [PATCH] Use URLSearchParams for paramsObject and update corresponding tests to expect URLSearchParams objects Add utility methods for URLSearchParams: URLSearchParams don't have notions of equality defined in the spec, so we go through iterating over all entries checking for equality for testing purposes; Chrome (v60) currently doesn't support constructing URLSearchParams from objects, so add utility method to convert objects into arrays of pairs Update tests to expect URLSearchParams for search query: Tests that would normally expect objects for search params now expect URLSearchParams; add test for multiple values same key Implement URLSearchParams for search query: Most of the work is offloaded to URLSearchParams re: parsing and serializing, this change is predominatly updating the type of paramsObject Add polyfill for URLSearchParams: I.E. does not implement URLSearchParams --- bower.json | 3 +- iron-query-params.html | 45 +++++++----------------- test/integration.html | 23 ++++++------ test/iron-query-params.html | 70 ++++++++++++++++++++++++++++++------- test/urlsearchparams.html | 27 ++++++++++++++ 5 files changed, 112 insertions(+), 56 deletions(-) create mode 100644 test/urlsearchparams.html diff --git a/bower.json b/bower.json index 84116f1..05589af 100644 --- a/bower.json +++ b/bower.json @@ -23,7 +23,8 @@ "homepage": "https://github.com/PolymerElements/iron-location", "ignore": [], "dependencies": { - "polymer": "Polymer/polymer#1.9 - 2" + "polymer": "Polymer/polymer#1.9 - 2", + "url-search-params": "^0.9.0" }, "devDependencies": { "iron-flex-layout": "PolymerElements/iron-flex-layout#1 - 2", diff --git a/iron-query-params.html b/iron-query-params.html index 635f5d7..4848365 100644 --- a/iron-query-params.html +++ b/iron-query-params.html @@ -10,7 +10,12 @@ @demo demo/iron-query-params.html --> - + + diff --git a/test/integration.html b/test/integration.html index 8cbfbaf..36c4420 100644 --- a/test/integration.html +++ b/test/integration.html @@ -92,22 +92,22 @@ expect(ironLocationQuery).to.contain(ironLocation.query); expect(ironLocationQuery).to.contain(ironQueryParams.paramsString); if (plainTextQuery) { - expect('').to.be.equal(ironQueryParams.paramsObject[plainTextQuery]) + expect('').to.be.equal(ironQueryParams.paramsObject.get(plainTextQuery)) } else { - expect(ironQueryParams.paramsObject[plainTextQuery]).to.be.undefined; + expect(ironQueryParams.paramsObject.get(plainTextQuery)).to.be.null; } } }); test('propagations from iqp to location', function() { var queryEncodingExamples = { - 'foo': '?foo', - '': '', - 'foo bar': '?foo%20bar', - 'foo#bar': '?foo%23bar', - 'foo?bar': '?foo?bar', - '/foo\'bar\'baz': ['?/foo%27bar%27baz', '?/foo\'bar\'baz'], - 'foo/bar/baz': '?foo/bar/baz' + 'foo': '?foo=', + '': '?=', + 'foo bar': '?foo%20bar=', + 'foo#bar': '?foo%23bar=', + 'foo?bar': '?foo?bar=', + '/foo\'bar\'baz': ['?/foo%27bar%27baz=', '?/foo\'bar\'baz='], + 'foo/bar/baz': '?foo/bar/baz=' }; for (var plainTextQuery in queryEncodingExamples) { var encodedQueries = queryEncodingExamples[plainTextQuery]; @@ -121,10 +121,11 @@ }); } - var newParamsObject = {}; - newParamsObject[plainTextQuery] = ''; + var newParamsObject = new URLSearchParams(); + newParamsObject.append(plainTextQuery, ''); ironQueryParams.paramsObject = newParamsObject; + // might need to notify expect(encodedQueries).to.contain(window.location.search); expect(ironLocationQuery).to.contain(ironLocation.query); } diff --git a/test/iron-query-params.html b/test/iron-query-params.html index 8b27642..0f34948 100644 --- a/test/iron-query-params.html +++ b/test/iron-query-params.html @@ -18,6 +18,7 @@ + @@ -33,6 +34,7 @@ suite('', function () { var paramsElem; + var expectedSearchParams; setup(function() { paramsElem = fixture('BasicQueryParams'); }); @@ -40,17 +42,49 @@ test('basic functionality with ?key=value params', function() { // Check initialization expect(paramsElem.paramsString).to.be.eq(''); - expect(paramsElem.paramsObject).to.deep.eq({}); + expectedSearchParams = new URLSearchParams(); + expect(URLSearchParamsUtil.equal( + paramsElem.paramsObject, + expectedSearchParams + )).to.be.true; // Check the mapping from paramsString to paramsObject. paramsElem.paramsString = 'greeting=hello&target=world'; - expect(paramsElem.paramsObject).to.deep.equal( - {greeting: 'hello', target: 'world'}); + expectedSearchParams = new URLSearchParams([ + ['greeting', 'hello'], + ['target', 'world'] + ]); + expect(URLSearchParamsUtil.equal( + paramsElem.paramsObject, + expectedSearchParams + )).to.be.true; + + // Check the mapping from paramsString to paramsObject + // with multiple values for the same key + // NOTE: order matters in the creation for URLSearchParams + // the spec has a sequence (which is ordered) as one of + // the valid constructor inits. This could be ameliorated + // with the .sort method, but only Firefox implements it + // as of July 2017. + paramsElem.paramsString = + 'greeting=hello&target=world&greeting=hola&target=mundo'; + expectedSearchParams = new URLSearchParams([ + ['greeting', 'hello'], + ['target', 'world'], + ['greeting', 'hola'], + ['target', 'mundo'] + ]); + expect(URLSearchParamsUtil.equal( + paramsElem.paramsObject, + expectedSearchParams + )).to.be.true; // Check the mapping from paramsObject back to paramsString. - paramsElem.set('paramsObject.another', 'key'); + let newParamsObject = new URLSearchParams(paramsElem.paramsObject); + newParamsObject.append('another', 'key'); + paramsElem.set('paramsObject', newParamsObject); expect(paramsElem.paramsString).to.be.equal( - 'greeting=hello&target=world&another=key'); + 'greeting=hello&target=world&greeting=hola&target=mundo&another=key'); }); test('encoding of params', function() { var mappings = [ @@ -59,7 +93,7 @@ object: {'a': 'b'} }, { - string: 'debug&ok', + string: 'debug=&ok=', object: {'debug': '', 'ok': ''} }, { @@ -74,27 +108,39 @@ mappings.forEach(function(mapping) { // Clear - paramsElem.paramsObject = {}; + paramsElem.paramsObject = new URLSearchParams(); expect(paramsElem.paramsString).to.be.equal(''); // Test going from string to object paramsElem.paramsString = mapping.string; - expect(paramsElem.paramsObject).to.deep.equal(mapping.object); + console.log(paramsElem.paramsObject.toString(), mapping.string); + expect(URLSearchParamsUtil.equal( + paramsElem.paramsObject, + new URLSearchParams( + URLSearchParamsUtil.objectToArray(mapping.object) + ) + )).to.be.true; // Clear again. - paramsElem.paramsObject = {}; + paramsElem.paramsObject = new URLSearchParams(); expect(paramsElem.paramsString).to.be.equal(''); // Test going from object to string - paramsElem.paramsObject = mapping.object; + paramsElem.paramsObject = new URLSearchParams( + URLSearchParamsUtil.objectToArray(mapping.object) + ); expect(paramsElem.paramsString).to.be.equal(mapping.string); }); }); test('query strings with alternative encodings', function() { // Check the mapping for querystrings with + instead of %20. paramsElem.paramsString = 'key=value+with+spaces'; - expect(paramsElem.paramsObject).to.deep.equal( - {key: 'value with spaces'}); + expect(URLSearchParamsUtil.equal( + paramsElem.paramsObject, + new URLSearchParams( + URLSearchParamsUtil.objectToArray({key: 'value with spaces'}) + ) + )).to.be.true; }); }); diff --git a/test/urlsearchparams.html b/test/urlsearchparams.html new file mode 100644 index 0000000..33e9152 --- /dev/null +++ b/test/urlsearchparams.html @@ -0,0 +1,27 @@ +