summaryrefslogtreecommitdiff
path: root/systrace/catapult/third_party/polymer/components/app-route/test/app-route.html
diff options
context:
space:
mode:
Diffstat (limited to 'systrace/catapult/third_party/polymer/components/app-route/test/app-route.html')
-rw-r--r--systrace/catapult/third_party/polymer/components/app-route/test/app-route.html488
1 files changed, 488 insertions, 0 deletions
diff --git a/systrace/catapult/third_party/polymer/components/app-route/test/app-route.html b/systrace/catapult/third_party/polymer/components/app-route/test/app-route.html
new file mode 100644
index 0000000..da4af2c
--- /dev/null
+++ b/systrace/catapult/third_party/polymer/components/app-route/test/app-route.html
@@ -0,0 +1,488 @@
+<!doctype html>
+<!--
+@license
+Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+-->
+<html>
+<head>
+ <title>app-route</title>
+
+ <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
+ <script src="../../web-component-tester/browser.js"></script>
+
+ <link rel="import" href="../../polymer/polymer.html">
+ <link rel="import" href="../app-route.html">
+ <link rel="import" href="./redirection.html">
+</head>
+<body>
+ <test-fixture id="BasicRoute">
+ <template>
+ <app-route pattern='/user/:username'>
+ </app-route>
+ </template>
+ </test-fixture>
+
+ <test-fixture id="ChainedRoutes">
+ <template is="dom-template">
+ <app-route
+ pattern="/foo/:foo"
+ route="{{numberOneTopRoute}}"
+ data="{{fooData}}"
+ tail="{{fooRoute}}">
+ </app-route>
+
+ <app-route
+ pattern="/bar/:bar"
+ route="{{fooRoute}}"
+ data="{{barData}}">
+ </app-route>
+
+ <app-route
+ pattern="/baz/:baz"
+ route="{{fooRoute}}"
+ data="{{bazData}}">
+ </app-route>
+ </template>
+ </test-fixture>
+
+ <test-fixture id="Redirection">
+ <template>
+ <redirect-app-route></redirect-app-route>
+ </template>
+ </test-fixture>
+
+<script>
+ 'use strict';
+
+ function fixtureChainedRoutes(route) {
+ var routes = fixture('ChainedRoutes', {
+ numberOneTopRoute: {
+ path: route.path || '',
+ prefix: route.prefix || '',
+ __queryParams: route.__queryParams || {}
+ }
+ });
+
+ return {
+ foo: routes[0],
+ bar: routes[1],
+ baz: routes[2]
+ };
+ }
+
+ suite('<app-route>', function () {
+ var route;
+
+ setup(function() {
+ route = fixture('BasicRoute');
+
+ // This works around a bug in `dom-template` that is somehow
+ // exaserbated by the `app-route` implementation. A reduced test case
+ // is hard to come by. Track polymerelements/test-fixture#31 and remove
+ // this when that has been resolved:
+ var tmpl = document.querySelector('#ChainedRoutes').fixtureTemplates[0];
+ tmpl._parentProps = {};
+ });
+
+ test('it parses a path', function() {
+ route.route = {
+ prefix: '',
+ path: '/user/papyrus/details',
+ __queryParams: {}
+ }
+ expect(route.tail.prefix).to.be.equal('/user/papyrus');
+ expect(route.tail.path).to.be.equal('/details');
+ expect(route.data.username).to.be.equal('papyrus');
+ });
+
+ test('it bidirectionally maps changes between tail and route', function() {
+ route.route = {
+ prefix: '',
+ path: '/user/papyrus/details',
+ __queryParams: {}
+ };
+
+ route.set('tail.path', '/messages');
+ expect(route.route.path).to.be.deep.equal('/user/papyrus/messages');
+ route.set('route.path', '/user/toriel');
+ expect(route.tail).to.be.deep.equal({
+ prefix: '/user/toriel',
+ path: '',
+ __queryParams: {}
+ });
+ });
+
+ test('it creates data as described by pattern', function() {
+ route.route = {
+ prefix: '',
+ path: '/user/sans'
+ };
+
+ expect(route.data).to.be.deep.equal({username: 'sans'});
+ expect(route.active).to.be.equal(true);
+
+ route.pattern = '/user/:username/likes/:count';
+
+ // At the moment, we don't reset data when we no longer match.
+ expect(route.data).to.be.deep.equal({username: 'sans'});
+ expect(route.active).to.be.equal(false);
+
+ route.set('route.path', "/does/not/match");
+
+ expect(route.data).to.be.deep.equal({username: 'sans'});
+ expect(route.active).to.be.equal(false);
+
+ route.set('route.path', '/user/undyne/likes/20');
+ expect(route.data).to.be.deep.equal({username: 'undyne', count: '20'});
+ expect(route.active).to.be.equal(true);
+ });
+
+ test('changing data changes the path', function() {
+ route.route = {
+ prefix: '',
+ path: '/user/asgore'
+ };
+
+ expect(route.data).to.be.deep.equal({username: 'asgore'});
+ route.data = {username: 'toriel'};
+ expect(route.route.path).to.be.equal('/user/toriel');
+ });
+
+ suite('propagating data', function() {
+ test('data is empty if no routes in the tree have matched', function() {
+ var routes = fixtureChainedRoutes({ path: '' });
+
+ expect(routes.foo.data).to.be.eql({});
+ expect(routes.bar.data).to.be.eql({});
+ expect(routes.baz.data).to.be.eql({});
+ });
+
+ test('limits propagation to last matched route', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123' });
+
+ expect(routes.foo.data).to.be.eql({ foo: '123' });
+ expect(routes.bar.data).to.be.eql({});
+ expect(routes.baz.data).to.be.eql({});
+ });
+
+ test('propagates data to matching chained routes', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc' });
+
+ expect(routes.foo.data).to.be.eql({ foo: '123' });
+ expect(routes.bar.data).to.be.eql({ bar: 'abc' });
+ expect(routes.baz.data).to.be.eql({});
+ });
+
+ test('chained route state is untouched when deactivated', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc' });
+
+ routes.foo.set('route.path', '/foo/321/baz/zyx');
+
+ expect(routes.foo.data).to.be.eql({ foo: '321' });
+ expect(routes.bar.data).to.be.eql({ bar: 'abc' });
+ expect(routes.baz.data).to.be.eql({ baz: 'zyx' });
+ });
+
+ suite('updating the global path', function() {
+ test('happens when data changes if the route is active', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc' });
+
+ expect(routes.bar.active).to.be.eql(true);
+ routes.bar.set('data.bar', 'cba');
+ expect(routes.foo.route.path).to.be.eql('/foo/123/bar/cba');
+ });
+
+ test('ignores changes when the route is inactive', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc' });
+
+ expect(routes.baz.active).to.be.eql(false);
+ routes.baz.set('data.baz', 'cba');
+ expect(routes.foo.route.path).to.be.eql('/foo/123/bar/abc');
+ });
+
+ test('ignores changes after a route deactives', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc' });
+
+ routes.foo.set('route.path', '/foo/123/baz/zyx');
+
+ expect(routes.bar.active).to.be.eql(false);
+ expect(routes.baz.active).to.be.eql(true);
+ routes.bar.set('data.bar', 'cba');
+ expect(routes.foo.route.path).to.be.eql('/foo/123/baz/zyx');
+ });
+ });
+ });
+
+ suite('propagating query params', function() {
+ test('query params are empty if no routes match', function() {
+ var routes = fixtureChainedRoutes({ path: '', __queryParams: {
+ qux: 'zot'
+ }});
+ expect(routes.foo.queryParams).to.be.eql({});
+ expect(routes.bar.queryParams).to.be.eql({});
+ expect(routes.baz.queryParams).to.be.eql({});
+ });
+
+ test('updates query params for all matched routes', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc', __queryParams: {
+ qux: 'zot'
+ }});
+ expect(routes.foo.queryParams).to.be.eql({ qux: 'zot' });
+ expect(routes.bar.queryParams).to.be.eql({ qux: 'zot' });
+ expect(routes.baz.queryParams).to.be.eql({});
+ });
+
+ test('retains query params after routes deactivate', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc', __queryParams: {
+ qux: 'zot'
+ }});
+ routes.foo.set('route.path', '/foo/123/baz/xyz')
+ routes.foo.set('queryParams', {
+ qux: 'quux'
+ });
+ expect(routes.foo.queryParams).to.be.eql({ qux: 'quux' });
+ expect(routes.bar.queryParams).to.be.eql({ qux: 'zot' });
+ expect(routes.baz.queryParams).to.be.eql({ qux: 'quux' });
+ });
+
+ suite('updating global query params', function() {
+ test('happens when query params change on active routes', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc', __queryParams: {
+ qux: 'zot'
+ }});
+
+ routes.bar.set('queryParams', { qux: 'quux' });
+
+ expect(routes.foo.queryParams).to.be.eql({ qux: 'quux' });
+ expect(routes.bar.queryParams).to.be.eql({ qux: 'quux' });
+ expect(routes.baz.queryParams).to.be.eql({});
+ });
+
+ test('updates are ignored for routes that are inactive', function() {
+ var routes = fixtureChainedRoutes({ path: '/foo/123/bar/abc', __queryParams: {
+ qux: 'zot'
+ }});
+
+ routes.baz.set('queryParams', { qux: 'quux' });
+
+ expect(routes.foo.queryParams).to.be.eql({ qux: 'zot' });
+ expect(routes.bar.queryParams).to.be.eql({ qux: 'zot' });
+ expect(routes.baz.queryParams).to.be.eql({ qux: 'quux' });
+ });
+
+ test('doesn\'t generate excess query-params-changed events', function() {
+ var routes = fixtureChainedRoutes({});
+ var appRoutes = [routes.foo, routes.bar, routes.baz];
+ var numChanges = 0;
+ for (var i = 0; i < appRoutes.length; i++) {
+ appRoutes[i].addEventListener('query-params-changed', function() {
+ numChanges++;
+ });
+ }
+
+ // Messing with paths but not query params shouldn't generate any
+ // change events.
+ expect(numChanges).to.be.equal(0);
+ routes.foo.set('route.path', '/foo/123/bar/456');
+ expect(numChanges).to.be.equal(0);
+ routes.foo.set('route.path', '/foo/456/baz/789');
+ expect(numChanges).to.be.equal(0);
+
+ // Changing queryParams here should update foo and baz
+ routes.foo.set('route.__queryParams', {key: 'value'});
+ expect(numChanges).to.be.equal(2);
+ // Then this should update bar
+ routes.foo.set('route.path', '/foo/123/bar/456');
+ expect(numChanges).to.be.equal(3);
+
+ // Changing back to baz shouldn't generate a change event.
+ routes.foo.set('route.path', '/foo/456/baz/789');
+ expect(numChanges).to.be.equal(3);
+
+ routes.foo.set('route.__queryParams', {});
+ expect(numChanges).to.be.equal(5);
+ routes.foo.set('route.path', '/foo/123/bar/456');
+ expect(numChanges).to.be.equal(6);
+
+ });
+ });
+ });
+
+ suite('handles reentrent changes to its properties', function() {
+ var initialUrl;
+ setup(function() {
+ initialUrl = window.location.href;
+ });
+
+ teardown(function() {
+ window.history.replaceState({}, '', initialUrl);
+ });
+
+ test('changing path in response to path changing', function() {
+ var r = fixture('Redirection');
+ r.addEventListener('route-changed', function() {
+ r.set('route.path', '/bar/baz');
+ });
+ r.set('route.path', '/foo');
+ expect(window.location.pathname).to.be.equal('/bar/baz');
+ expect(r.data).to.be.deep.equal({page: 'bar'});
+ expect(r.route.path).to.be.equal('/bar/baz');
+ expect(r.tail.path).to.be.equal('/baz');
+ });
+
+ test('changing data wholesale in response to path changing', function() {
+ var r = fixture('Redirection');
+ r.set('data.page', 'bar');
+ r.addEventListener('route-changed', function(e) {
+ if (e.detail.path === 'route.path' && r.route.path === '/foo/baz') {
+ r.data = {page: 'bar'};
+ }
+ });
+ r.set('route.path', '/foo/baz');
+ expect(window.location.pathname).to.be.equal('/bar');
+ expect(r.data).to.be.deep.equal({page: 'bar'});
+ expect(r.route.path).to.be.equal('/bar');
+ expect(r.tail.path).to.be.equal('');
+ });
+
+ test('changing a data piece in response to path changing', function() {
+ var r = fixture('Redirection');
+ r.set('data.page', 'bar');
+ r.addEventListener('route-changed', function(e) {
+ r.set('data.page', 'bar');
+ });
+ r.set('route.path', '/foo/baz');
+ expect(window.location.pathname).to.be.equal('/bar');
+ expect(r.data).to.be.deep.equal({page: 'bar'});
+ expect(r.route.path).to.be.equal('/bar');
+ expect(r.tail.path).to.be.equal('');
+ });
+
+ test('changing the tail in response to path changing', function() {
+ var r = fixture('Redirection');
+ r.addEventListener('route-changed', function() {
+ r.set('tail.path', '/bar');
+ });
+ r.set('route.path', '/foo');
+ expect(window.location.pathname).to.be.equal('/foo/bar');
+ expect(r.data).to.be.deep.equal({page: 'foo'});
+ expect(r.route.path).to.be.equal('/foo/bar');
+ expect(r.tail.path).to.be.equal('/bar');
+
+ r.set('route.path', '/foo/baz');
+ expect(window.location.pathname).to.be.equal('/foo/bar');
+ expect(r.data).to.be.deep.equal({page: 'foo'});
+ expect(r.route.path).to.be.equal('/foo/bar');
+ expect(r.tail.path).to.be.equal('/bar');
+ });
+
+ test('changing the path in response to data changing', function() {
+ var r = fixture('Redirection');
+ r.addEventListener('data-changed', function() {
+ r.set('route.path', '/bar');
+ });
+ r.set('data', {page: 'foo'});
+ expect(window.location.pathname).to.be.equal('/bar');
+ expect(r.data).to.be.deep.equal({page: 'bar'});
+ expect(r.route.path).to.be.equal('/bar');
+ expect(r.tail.path).to.be.equal('');
+ });
+
+ test('changing data in response to data changing', function() {
+ var r = fixture('Redirection');
+ r.addEventListener('data-changed', function() {
+ r.set('data.page', 'bar');
+ });
+ r.set('data', {page: 'foo'});
+ expect(window.location.pathname).to.be.equal('/bar');
+ expect(r.data).to.be.deep.equal({page: 'bar'});
+ expect(r.route.path).to.be.equal('/bar');
+ expect(r.tail.path).to.be.equal('');
+ });
+
+ test('changing the data object wholesale in response to data changing', function() {
+ var r = fixture('Redirection');
+ r.addEventListener('data-changed', function() {
+ if (r.data.page == 'foo') {
+ r.set('data', {page: 'bar'});
+ }
+ });
+ r.set('data', {page: 'foo'});
+ expect(window.location.pathname).to.be.equal('/bar');
+ expect(r.data).to.be.deep.equal({page: 'bar'});
+ expect(r.route.path).to.be.equal('/bar');
+ expect(r.tail.path).to.be.equal('');
+ });
+
+ test('changing the tail in response to data changing', function() {
+ var r = fixture('Redirection');
+ r.addEventListener('data-changed', function() {
+ r.set('tail.path', '/bar');
+ });
+ r.set('data', {page: 'foo'});
+ expect(window.location.pathname).to.be.equal('/foo/bar');
+ expect(r.data).to.be.deep.equal({page: 'foo'});
+ expect(r.route.path).to.be.equal('/foo/bar');
+ expect(r.tail.path).to.be.equal('/bar');
+ });
+
+ test('changing the path in response to tail changing', function() {
+ var r = fixture('Redirection');
+ r.set('route.path', '/foo/');
+ r.addEventListener('tail-changed', function() {
+ r.set('route.path', '/baz' + r.tail.path);
+ });
+ r.set('tail.path', '/bar');
+ expect(window.location.pathname).to.be.equal('/baz/bar');
+ expect(r.data).to.be.deep.equal({page: 'baz'});
+ expect(r.route.path).to.be.equal('/baz/bar');
+ expect(r.tail.path).to.be.equal('/bar');
+ });
+
+ test('changing the data in response to tail changing', function() {
+ var r = fixture('Redirection');
+ r.set('route.path', '/foo/');
+ r.addEventListener('tail-changed', function() {
+ r.set('data.page', 'baz');
+ });
+ r.set('tail.path', '/bar');
+ expect(window.location.pathname).to.be.equal('/baz');
+ expect(r.data).to.be.deep.equal({page: 'baz'});
+ expect(r.route.path).to.be.equal('/baz');
+ expect(r.tail.path).to.be.equal('');
+ });
+
+ test('changing the data object wholesale in response to tail changing', function() {
+ var r = fixture('Redirection');
+ r.set('route.path', '/foo/');
+ r.addEventListener('tail-changed', function() {
+ r.set('data', {page: 'baz'});
+ });
+ r.set('tail.path', '/bar');
+ expect(window.location.pathname).to.be.equal('/baz');
+ expect(r.data).to.be.deep.equal({page: 'baz'});
+ expect(r.route.path).to.be.equal('/baz');
+ expect(r.tail.path).to.be.equal('');
+ });
+
+ test('changing the tail in response to tail changing', function() {
+ var r = fixture('Redirection');
+ r.set('route.path', '/foo/');
+ r.addEventListener('tail-changed', function() {
+ r.set('tail.path', '/baz');
+ });
+ r.set('tail.path', '/bar');
+ expect(window.location.pathname).to.be.equal('/foo/baz');
+ expect(r.data).to.be.deep.equal({page: 'foo'});
+ expect(r.route.path).to.be.equal('/foo/baz');
+ expect(r.tail.path).to.be.equal('/baz');
+ });
+ });
+ });
+</script>
+</body>
generated by cgit v1.2.3 (git 2.25.1) at 2024-05-17 08:47:22 +0000