diff --git a/addon/components/_has-dom.ts b/addon/components/_has-dom.ts new file mode 100644 index 0000000..7928623 --- /dev/null +++ b/addon/components/_has-dom.ts @@ -0,0 +1,19 @@ +// check if window exists and actually is the global +export default typeof self === 'object' && + self !== null && + (self as Window['self']).Object === Object && + typeof Window !== 'undefined' && + self.constructor === Window && + typeof document === 'object' && + document !== null && + self.document === document && + typeof location === 'object' && + location !== null && + self.location === location && + typeof history === 'object' && + history !== null && + self.history === history && + typeof navigator === 'object' && + navigator !== null && + self.navigator === navigator && + typeof navigator.userAgent === 'string'; diff --git a/addon/components/_internals.ts b/addon/components/_internals.ts new file mode 100644 index 0000000..e600f9e --- /dev/null +++ b/addon/components/_internals.ts @@ -0,0 +1,78 @@ +function intern(str: string): string { + let obj = {}; + //@ts-ignore + obj[str] = 1; + for (let key in obj) { + if (key === str) { + return key; + } + } + return str; +} + +const GUID_KEY = intern(`__ember${Date.now()}`); + +// `enumerableSymbol` copied from https://github.com/emberjs/ember.js/blob/master/packages/@ember/-internals/utils/lib/symbol.ts +// for not exported code these legacy components are dependant on. + +// Some legacy symbols still need to be enumerable for a variety of reasons. +// This code exists for that, and as a fallback in IE11. In general, prefer +// `symbol` below when creating a new symbol. +function enumerableSymbol(debugName: string): string { + let id = GUID_KEY + Math.floor(Math.random() * Date.now()); + let symbol = intern(`__${debugName}${id}__`); + return symbol; +} + +export const HAS_BLOCK = enumerableSymbol('HAS_BLOCK'); + +export function isSimpleClick(event: MouseEvent): boolean { + let modifier = + event.shiftKey || event.metaKey || event.altKey || event.ctrlKey; + let secondaryClick = event.which > 1; // IE9 may return undefined + + return !modifier && !secondaryClick; +} + +// export interface GlobalContext { +// imports: object; +// exports: object; +// lookup: object; +// } + +// /* globals global, window, self */ +// declare const mainContext: object | undefined; + +// // from lodash to catch fake globals +// function checkGlobal(value: any | null | undefined): value is object { +// return value && value.Object === Object ? value : undefined; +// } + +// // element ids can ruin global miss checks +// function checkElementIdShadowing(value: any | null | undefined) { +// return value && value.nodeType === undefined ? value : undefined; +// } + +// // export real global +// export default checkGlobal(checkElementIdShadowing(typeof global === 'object' && global)) || +// checkGlobal(typeof self === 'object' && self) || +// checkGlobal(typeof window === 'object' && window) || +// (typeof mainContext !== 'undefined' && mainContext) || // set before strict mode in Ember loader/wrapper +// new Function('return this')(); // eval outside of strict mode + +// // legacy imports/exports/lookup stuff (should we keep this??) +// export const context = (function ( +// global: object, +// Ember: Partial | undefined +// ): GlobalContext { +// return Ember === undefined +// ? { imports: global, exports: global, lookup: global } +// : { +// // import jQuery +// imports: Ember.imports || global, +// // export Ember +// exports: Ember.exports || global, +// // search for Namespaces +// lookup: Ember.lookup || global, +// }; +// })(global, global.Ember); diff --git a/addon/components/checkbox.hbs b/addon/components/checkbox.hbs new file mode 100644 index 0000000..fb5c4b1 --- /dev/null +++ b/addon/components/checkbox.hbs @@ -0,0 +1 @@ +{{yield}} \ No newline at end of file diff --git a/addon/components/checkbox.js b/addon/components/checkbox.js index d3daf59..8baae06 100644 --- a/addon/components/checkbox.js +++ b/addon/components/checkbox.js @@ -1,12 +1,12 @@ +//@ts-check /* eslint-disable ember/no-component-lifecycle-hooks */ /* eslint-disable ember/require-tagless-components */ /* eslint-disable ember/no-classic-classes */ /* eslint-disable ember/no-classic-components */ -import { set } from '@ember/-internals/metal'; +import { set } from '@ember/object'; import { assert } from '@ember/debug'; import { DEBUG } from '@glimmer/env'; import EmberComponent from '@ember/component'; -import layout from '../templates/empty'; /** @module @ember/component @@ -32,12 +32,9 @@ import layout from '../templates/empty'; properties will not be applied. @class Checkbox - @extends Component @public */ const Checkbox = EmberComponent.extend({ - layout, - /** By default, this component will add the `ember-checkbox` class to the component's element. diff --git a/addon/components/link-to.ts b/addon/components/link-to.ts index 864fbba..5b759b0 100644 --- a/addon/components/link-to.ts +++ b/addon/components/link-to.ts @@ -1,6 +1,3 @@ -/** -@module ember -*/ import { alias } from '@ember/object/computed'; import { computed } from '@ember/object'; import { getOwner } from '@ember/application'; @@ -10,13 +7,8 @@ import { getEngineParent } from '@ember/engine'; import EngineInstance from '@ember/engine/instance'; import { inject as injectService } from '@ember/service'; import { DEBUG } from '@glimmer/env'; - -// private -import RouterState from '@ember/-internals/routing/lib/system/router_state'; -import { isSimpleClick } from '@ember/-internals/views'; -import { flaggedInstrument } from '@ember/instrumentation'; - -import { HAS_BLOCK } from '../component-managers/curly'; +import { isSimpleClick } from './_internals'; +import { HAS_BLOCK } from './_internals'; /** The `LinkTo` component renders a link to the supplied `routeName` passing an optionally @@ -515,7 +507,7 @@ const LinkComponent = EmberComponent.extend({ let { eventName } = this; this.on(eventName, this, this._invoke); }, - + //@ts-ignore _routing: injectService('-routing'), _currentRoute: alias('_routing.currentRouteName'), _currentRouterState: alias('_routing.currentState'), @@ -526,6 +518,7 @@ const LinkComponent = EmberComponent.extend({ }), _engineMountPoint: computed(function (this: any) { + //@ts-ignore return (getOwner(this) as EngineInstance).mountPoint; }), @@ -658,7 +651,7 @@ const LinkComponent = EmberComponent.extend({ } ), - _isActive(routerState: RouterState): boolean { + _isActive(routerState: any /* RouterState */): boolean { if (this.loading) { return false; } @@ -785,16 +778,23 @@ const LinkComponent = EmberComponent.extend({ routeName, }; - flaggedInstrument( - 'interaction.link-to', + // flaggedInstrument( + // 'interaction.link-to', + // payload, + // this._generateTransition( + // payload, + // routeName, + // models, + // queryParams, + // shouldReplace + // ) + // ); + this._generateTransition( payload, - this._generateTransition( - payload, - routeName, - models, - queryParams, - shouldReplace - ) + routeName, + models, + queryParams, + shouldReplace ); return false; }, diff --git a/addon/components/text-field.ts b/addon/components/text-field.ts index 3b2e340..fef5fb7 100644 --- a/addon/components/text-field.ts +++ b/addon/components/text-field.ts @@ -1,11 +1,13 @@ +/* eslint-disable ember/no-mixins */ +/* eslint-disable ember/no-classic-classes */ /** @module @ember/component */ -import { hasDOM } from '@ember/-internals/browser-environment'; -import { computed } from '@ember/-internals/metal'; -import { TextSupport } from '@ember/-internals/views'; -import Component from '../component'; -import layout from '../templates/empty'; + +import hasDOM from './_has-dom'; +import { computed } from '@ember/object'; +import Component from '@ember/component'; +import { TextSupport } from '../mixins/text-support'; const inputTypes = hasDOM ? Object.create(null) : null; function canSetTypeOfInput(type: string): boolean { @@ -46,8 +48,6 @@ function canSetTypeOfInput(type: string): boolean { @public */ const TextField = Component.extend(TextSupport, { - layout, - /** By default, this component will add the `ember-text-field` class to the component's element. diff --git a/addon/mixins/_target_action_support.js b/addon/mixins/_target_action_support.js new file mode 100644 index 0000000..d95b013 --- /dev/null +++ b/addon/mixins/_target_action_support.js @@ -0,0 +1,150 @@ +/* eslint-disable ember/no-get */ +/* eslint-disable ember/no-new-mixins */ +/** +@module ember +*/ + +import { context } from '../components/_internals'; +import { get, computed } from '@ember/object'; +import Mixin from '@ember/object/mixin'; +import { assert } from '@ember/debug'; +/** +`Ember.TargetActionSupport` is a mixin that can be included in a class +to add a `triggerAction` method with semantics similar to the Handlebars +`{{action}}` helper. In normal Ember usage, the `{{action}}` helper is +usually the best choice. This mixin is most often useful when you are +doing more complex event handling in Components. + +@class TargetActionSupport +@namespace Ember +@extends Mixin +@private +*/ +export default Mixin.create({ + target: null, + action: null, + actionContext: null, + + actionContextObject: computed('actionContext', function () { + let actionContext = get(this, 'actionContext'); + + if (typeof actionContext === 'string') { + let value = get(this, actionContext); + if (value === undefined) { + value = get(context.lookup, actionContext); + } + return value; + } else { + return actionContext; + } + }), + + /** + Send an `action` with an `actionContext` to a `target`. The action, actionContext + and target will be retrieved from properties of the object. For example: + + ```javascript + import { alias } from '@ember/object/computed'; + + App.SaveButtonView = Ember.View.extend(Ember.TargetActionSupport, { + target: alias('controller'), + action: 'save', + actionContext: alias('context'), + click() { + this.triggerAction(); // Sends the `save` action, along with the current context + // to the current controller + } + }); + ``` + + The `target`, `action`, and `actionContext` can be provided as properties of + an optional object argument to `triggerAction` as well. + + ```javascript + App.SaveButtonView = Ember.View.extend(Ember.TargetActionSupport, { + click() { + this.triggerAction({ + action: 'save', + target: this.get('controller'), + actionContext: this.get('context') + }); // Sends the `save` action, along with the current context + // to the current controller + } + }); + ``` + + The `actionContext` defaults to the object you are mixing `TargetActionSupport` into. + But `target` and `action` must be specified either as properties or with the argument + to `triggerAction`, or a combination: + + ```javascript + import { alias } from '@ember/object/computed'; + + App.SaveButtonView = Ember.View.extend(Ember.TargetActionSupport, { + target: alias('controller'), + click() { + this.triggerAction({ + action: 'save' + }); // Sends the `save` action, along with a reference to `this`, + // to the current controller + } + }); + ``` + + @method triggerAction + @param opts {Object} (optional, with the optional keys action, target and/or actionContext) + @return {Boolean} true if the action was sent successfully and did not return false + @private + */ + triggerAction(opts = {}) { + let { action, target, actionContext } = opts; + action = action || get(this, 'action'); + target = target || getTarget(this); + + if (actionContext === undefined) { + actionContext = get(this, 'actionContextObject') || this; + } + + if (target && action) { + let ret; + + if (target.send) { + ret = target.send(...[action].concat(actionContext)); + } else { + assert( + `The action '${action}' did not exist on ${target}`, + typeof target[action] === 'function' + ); + ret = target[action](...[].concat(actionContext)); + } + + if (ret !== false) { + return true; + } + } + + return false; + }, +}); + +function getTarget(instance) { + let target = get(instance, 'target'); + if (target) { + if (typeof target === 'string') { + let value = get(instance, target); + if (value === undefined) { + value = get(context.lookup, target); + } + + return value; + } else { + return target; + } + } + + if (instance._target) { + return instance._target; + } + + return null; +} diff --git a/addon/mixins/text-support.js b/addon/mixins/text-support.js index c73fdb3..dab6f55 100644 --- a/addon/mixins/text-support.js +++ b/addon/mixins/text-support.js @@ -1,10 +1,7 @@ /* eslint-disable ember/no-new-mixins */ -/** -@module ember -*/ - -import { get, set, Mixin } from '@ember/-internals/metal'; -import { TargetActionSupport } from '@ember/-internals/runtime'; +import { get, set } from '@ember/object'; +import Mixin from '@ember/object/mixin'; +import { TargetActionSupport } from './_target_action_support'; import { deprecate } from '@ember/debug'; import { SEND_ACTION } from '@ember/deprecated-features'; import { MUTABLE_CELL } from '@ember/-internals/views'; diff --git a/tests/dummy/app/components/checkbox.js b/tests/dummy/app/components/checkbox.js new file mode 100644 index 0000000..a59c3b0 --- /dev/null +++ b/tests/dummy/app/components/checkbox.js @@ -0,0 +1 @@ +export { default } from 'ember-legacy-built-in-components/components/checkbox'; diff --git a/tests/dummy/app/components/link-to.js b/tests/dummy/app/components/link-to.js new file mode 100644 index 0000000..585f860 --- /dev/null +++ b/tests/dummy/app/components/link-to.js @@ -0,0 +1 @@ +export { default } from 'ember-legacy-built-in-components/components/link-to'; diff --git a/tests/dummy/app/components/text-field.js b/tests/dummy/app/components/text-field.js new file mode 100644 index 0000000..2f56612 --- /dev/null +++ b/tests/dummy/app/components/text-field.js @@ -0,0 +1 @@ +export { default } from 'ember-legacy-built-in-components/components/text-field'; diff --git a/tests/dummy/app/components/textarea.js b/tests/dummy/app/components/textarea.js new file mode 100644 index 0000000..b6365d2 --- /dev/null +++ b/tests/dummy/app/components/textarea.js @@ -0,0 +1 @@ +export { default } from 'ember-legacy-built-in-components/components/textarea'; diff --git a/tests/dummy/app/mixins/text-support.js b/tests/dummy/app/mixins/text-support.js new file mode 100644 index 0000000..1d6ba9c --- /dev/null +++ b/tests/dummy/app/mixins/text-support.js @@ -0,0 +1 @@ +export { default } from 'ember-legacy-built-in-components/mixins/text-support'; diff --git a/tests/integration/components/checkbox-test.js b/tests/integration/components/checkbox-test.js index bbfc2b6..b38329b 100644 --- a/tests/integration/components/checkbox-test.js +++ b/tests/integration/components/checkbox-test.js @@ -3,10 +3,10 @@ import { setupRenderingTest } from 'ember-qunit'; import { render } from '@ember/test-helpers'; import { hbs } from 'ember-cli-htmlbars'; -module('Integration | Component | checkbox', function(hooks) { +module('Integration | Component | checkbox', function (hooks) { setupRenderingTest(hooks); - test('it renders', async function(assert) { + test('it renders', async function (assert) { // Set any properties with this.set('myProperty', 'value'); // Handle any actions with this.set('myAction', function(val) { ... }); diff --git a/tests/integration/components/link-to/query-params-angle-test.js b/tests/integration/components/link-to/query-params-angle-test.js index a7924ef..d2a6d7d 100644 --- a/tests/integration/components/link-to/query-params-angle-test.js +++ b/tests/integration/components/link-to/query-params-angle-test.js @@ -3,8 +3,8 @@ /* eslint-disable ember/no-classic-classes */ /* eslint-disable ember/no-test-module-for */ import Controller from '@ember/controller'; -import { RSVP } from '@ember/-internals/runtime'; -import { Route } from '@ember/-internals/routing'; +import RSVP from 'rsvp'; +import Route from '@ember/routing/route'; import { ApplicationTestCase, classes as classMatcher, @@ -76,895 +76,895 @@ moduleFor( } ); -moduleFor( - ' component with query params (routing)', - class extends ApplicationTestCase { - constructor(...args) { - super(...args); - - let indexProperties = { - foo: '123', - bar: 'abc', - }; - - this.add( - 'controller:index', - class extends Controller { - queryParams = ['foo', 'bar', 'abool']; - foo = indexProperties.foo; - bar = indexProperties.bar; - boundThing = 'OMG'; - abool = true; - } - ); - - this.add( - 'controller:about', - class extends Controller { - queryParams = ['baz', 'bat']; - baz = 'alex'; - bat = 'borf'; - } - ); - - this.indexProperties = indexProperties; - } - - shouldNotBeActive(assert, selector) { - this.checkActive(assert, selector, false); - } - - shouldBeActive(assert, selector) { - this.checkActive(assert, selector, true); - } - - getController(name) { - return this.applicationInstance.lookup(`controller:${name}`); - } - - checkActive(assert, selector, active) { - let classList = this.$(selector)[0].className; - assert.equal( - classList.indexOf('active') > -1, - active, - selector + ' active should be ' + active.toString() - ); - } - - async [`@test it doesn't update controller QP properties on current route when invoked`]( - assert - ) { - this.addTemplate( - 'index', - `Index` - ); - - await this.visit('/'); - - await this.click('#the-link'); - - let indexController = this.getController('index'); - - assert.deepEqual( - indexController.getProperties('foo', 'bar'), - this.indexProperties, - 'controller QP properties do not update' - ); - } - - async [`@test it doesn't update controller QP properties on current route when invoked (empty query-params obj)`]( - assert - ) { - this.addTemplate( - 'index', - `Index` - ); - - await this.visit('/'); - - await this.click('#the-link'); - - let indexController = this.getController('index'); - - assert.deepEqual( - indexController.getProperties('foo', 'bar'), - this.indexProperties, - 'controller QP properties do not update' - ); - } - - async [`@test it doesn't update controller QP properties on current route when invoked (empty query-params obj, inferred route)`]( - assert - ) { - this.addTemplate( - 'index', - `Index` - ); - - await this.visit('/'); - - await this.click('#the-link'); - - let indexController = this.getController('index'); - - assert.deepEqual( - indexController.getProperties('foo', 'bar'), - this.indexProperties, - 'controller QP properties do not update' - ); - } - - async ['@test it updates controller QP properties on current route when invoked']( - assert - ) { - this.addTemplate( - 'index', - ` - - Index - - ` - ); - - await this.visit('/'); - - await this.click('#the-link'); - - let indexController = this.getController('index'); - - assert.deepEqual( - indexController.getProperties('foo', 'bar'), - { foo: '456', bar: 'abc' }, - 'controller QP properties updated' - ); - } - - async ['@test it updates controller QP properties on current route when invoked (inferred route)']( - assert - ) { - this.addTemplate( - 'index', - ` - - Index - - ` - ); - - await this.visit('/'); - - await this.click('#the-link'); - - let indexController = this.getController('index'); - - assert.deepEqual( - indexController.getProperties('foo', 'bar'), - { foo: '456', bar: 'abc' }, - 'controller QP properties updated' - ); - } - - async ['@test it updates controller QP properties on other route after transitioning to that route']( - assert - ) { - this.router.map(function () { - this.route('about'); - }); - - this.addTemplate( - 'index', - ` - - About - - ` - ); - - await this.visit('/'); - - let theLink = this.$('#the-link'); - - assert.equal(theLink.attr('href'), '/about?baz=lol'); - - runTask(() => this.click('#the-link')); - - let aboutController = this.getController('about'); - - assert.deepEqual( - aboutController.getProperties('baz', 'bat'), - { baz: 'lol', bat: 'borf' }, - 'about controller QP properties updated' - ); - } - - async ['@test it generates proper href for `LinkTo` with no @route after transitioning to an error route [GH#17963]']( - assert - ) { - this.router.map(function () { - this.route('bad'); - }); - - this.add( - 'controller:application', - class extends Controller { - queryParams = ['baz']; - } - ); - - this.add( - 'route:bad', - class extends Route { - model() { - throw new Error('bad!'); - } - } - ); - - this.addTemplate('error', `Error: {{@model.message}}`); - - this.addTemplate( - 'application', - ` - - Bad - - - - Good - - - {{outlet}} - ` - ); - - await this.visit('/'); - - assert.equal( - this.$('#good-link').length, - 1, - 'good-link should be in the DOM' - ); - assert.equal( - this.$('#bad-link').length, - 1, - 'bad-link should be in the DOM' - ); - - let goodLink = this.$('#good-link'); - assert.equal(goodLink.attr('href'), '/?baz=lol'); - - await this.visit('/bad'); - - assert.equal( - this.$('#good-link').length, - 1, - 'good-link should be in the DOM' - ); - assert.equal( - this.$('#bad-link').length, - 1, - 'bad-link should be in the DOM' - ); - - goodLink = this.$('#good-link'); - // should still be / because we never entered /bad (it errored before being fully entered) - // and error states do not get represented in the URL, so we are _effectively_ still - // on / - assert.equal(goodLink.attr('href'), '/?baz=lol'); - - runTask(() => this.click('#good-link')); - - let applicationController = this.getController('application'); - assert.deepEqual( - applicationController.getProperties('baz'), - { baz: 'lol' }, - 'index controller QP properties updated' - ); - } - - async ['@test supplied QP properties can be bound'](assert) { - this.addTemplate( - 'index', - ` - - Index - - ` - ); - - await this.visit('/'); - - let indexController = this.getController('index'); - let theLink = this.$('#the-link'); - - assert.equal(theLink.attr('href'), '/?foo=OMG'); - - runTask(() => indexController.set('boundThing', 'ASL')); - - assert.equal(theLink.attr('href'), '/?foo=ASL'); - } - - async ['@test supplied QP properties can be bound (booleans)'](assert) { - this.addTemplate( - 'index', - ` - - Index - - ` - ); - - await this.visit('/'); - - let indexController = this.getController('index'); - let theLink = this.$('#the-link'); - - assert.equal(theLink.attr('href'), '/?abool=OMG'); - - runTask(() => indexController.set('boundThing', false)); - - assert.equal(theLink.attr('href'), '/?abool=false'); - - await this.click('#the-link'); - - assert.deepEqual( - indexController.getProperties('foo', 'bar', 'abool'), - { foo: '123', bar: 'abc', abool: false }, - 'bound bool QP properties update' - ); - } - - async ['@test href updates when unsupplied controller QP props change']( - assert - ) { - this.addTemplate( - 'index', - ` - - Index - - ` - ); - - await this.visit('/'); - - let indexController = this.getController('index'); - let theLink = this.$('#the-link'); - - assert.equal(theLink.attr('href'), '/?foo=lol'); - - runTask(() => indexController.set('bar', 'BORF')); - await runLoopSettled(); - - assert.equal(theLink.attr('href'), '/?bar=BORF&foo=lol'); - - runTask(() => indexController.set('foo', 'YEAH')); - await runLoopSettled(); - - assert.equal(theLink.attr('href'), '/?bar=BORF&foo=lol'); - } - - async ['@test [GH#12033] with only query params, it always transitions to the current route with the query params applied']( - assert - ) { - this.addTemplate( - 'cars', - ` - Create new car - Page 2 - {{outlet}} - ` - ); - - this.addTemplate( - 'cars.create', - `Close create form` - ); - - this.router.map(function () { - this.route('cars', function () { - this.route('create'); - }); - }); - - this.add( - 'controller:cars', - class extends Controller { - queryParams = ['page']; - page = 1; - } - ); - - await this.visit('/cars/create'); - - let router = this.appRouter; - let carsController = this.getController('cars'); - - assert.equal(router.currentRouteName, 'cars.create'); - - runTask(() => this.click('#close-link')); - - assert.equal(router.currentRouteName, 'cars.index'); - assert.equal(router.get('url'), '/cars'); - assert.equal(carsController.get('page'), 1, 'The page query-param is 1'); - - runTask(() => this.click('#page2-link')); - - assert.equal( - router.currentRouteName, - 'cars.index', - 'The active route is still cars' - ); - assert.equal( - router.get('url'), - '/cars?page=2', - 'The url has been updated' - ); - assert.equal( - carsController.get('page'), - 2, - 'The query params have been updated' - ); - } - - async ['@test it applies activeClass when query params are not changed']( - assert - ) { - this.addTemplate( - 'index', - ` - Index - Index - Index - ` - ); - - this.addTemplate( - 'search', - ` - Index - Index - Index - Index - Index - Index - Index - {{outlet}} - ` - ); - - this.addTemplate( - 'search.results', - ` - Index - Index - Index - Index - Index - Index - Index - ` - ); - - this.router.map(function () { - this.route('search', function () { - this.route('results'); - }); - }); - - this.add( - 'controller:search', - class extends Controller { - queryParams = ['search', 'archive']; - search = ''; - archive = false; - } - ); - - this.add( - 'controller:search.results', - class extends Controller { - queryParams = ['sort', 'showDetails']; - sort = 'title'; - showDetails = true; - } - ); - - await this.visit('/'); - - this.shouldNotBeActive(assert, '#cat-link'); - this.shouldNotBeActive(assert, '#dog-link'); - - await this.visit('/?foo=cat'); - - this.shouldBeActive(assert, '#cat-link'); - this.shouldNotBeActive(assert, '#dog-link'); - - await this.visit('/?foo=dog'); - - this.shouldBeActive(assert, '#dog-link'); - this.shouldNotBeActive(assert, '#cat-link'); - this.shouldBeActive(assert, '#change-nothing'); - - await this.visit('/search?search=same'); - - this.shouldBeActive(assert, '#same-search'); - this.shouldNotBeActive(assert, '#change-search'); - this.shouldNotBeActive(assert, '#same-search-add-archive'); - this.shouldNotBeActive(assert, '#only-add-archive'); - this.shouldNotBeActive(assert, '#remove-one'); - - await this.visit('/search?search=same&archive=true'); - - this.shouldBeActive(assert, '#both-same'); - this.shouldNotBeActive(assert, '#change-one'); - - await this.visit( - '/search/results?search=same&sort=title&showDetails=true' - ); - - this.shouldBeActive(assert, '#same-sort-child-only'); - this.shouldBeActive(assert, '#same-search-parent-only'); - this.shouldNotBeActive(assert, '#change-search-parent-only'); - this.shouldBeActive(assert, '#same-search-same-sort-child-and-parent'); - this.shouldNotBeActive( - assert, - '#same-search-different-sort-child-and-parent' - ); - this.shouldNotBeActive( - assert, - '#change-search-same-sort-child-and-parent' - ); - } - - async ['@test it applies active class when query-param is a number']( - assert - ) { - this.addTemplate( - 'index', - ` - - Index - - ` - ); - - this.add( - 'controller:index', - class extends Controller { - queryParams = ['page']; - page = 1; - pageNumber = 5; - } - ); - - await this.visit('/'); - - this.shouldNotBeActive(assert, '#page-link'); - - await this.visit('/?page=5'); - - this.shouldBeActive(assert, '#page-link'); - } - - async ['@test it applies active class when query-param is an array']( - assert - ) { - this.addTemplate( - 'index', - ` - Index - Index - Index - ` - ); - - this.add( - 'controller:index', - class extends Controller { - queryParams = ['pages']; - pages = []; - pagesArray = [1, 2]; - biggerArray = [1, 2, 3]; - emptyArray = []; - } - ); - - await this.visit('/'); - - this.shouldNotBeActive(assert, '#array-link'); - - await this.visit('/?pages=%5B1%2C2%5D'); - - this.shouldBeActive(assert, '#array-link'); - this.shouldNotBeActive(assert, '#bigger-link'); - this.shouldNotBeActive(assert, '#empty-link'); - - await this.visit('/?pages=%5B2%2C1%5D'); - - this.shouldNotBeActive(assert, '#array-link'); - this.shouldNotBeActive(assert, '#bigger-link'); - this.shouldNotBeActive(assert, '#empty-link'); - - await this.visit('/?pages=%5B1%2C2%2C3%5D'); - - this.shouldBeActive(assert, '#bigger-link'); - this.shouldNotBeActive(assert, '#array-link'); - this.shouldNotBeActive(assert, '#empty-link'); - } - - async ['@test it applies active class to the parent route'](assert) { - this.router.map(function () { - this.route('parent', function () { - this.route('child'); - }); - }); - - this.addTemplate( - 'application', - ` - Parent - Child - Parent - {{outlet}} - ` - ); - - this.add( - 'controller:parent.child', - class extends Controller { - queryParams = ['foo']; - foo = 'bar'; - } - ); - - await this.visit('/'); - - this.shouldNotBeActive(assert, '#parent-link'); - this.shouldNotBeActive(assert, '#parent-child-link'); - this.shouldNotBeActive(assert, '#parent-link-qp'); - - await this.visit('/parent/child?foo=dog'); - - this.shouldBeActive(assert, '#parent-link'); - this.shouldNotBeActive(assert, '#parent-link-qp'); - } - - async ['@test it disregards query-params in activeness computation when current-when is specified']( - assert - ) { - let appLink; - - this.router.map(function () { - this.route('parent'); - }); - - this.addTemplate( - 'application', - ` - - Parent - - {{outlet}} - ` - ); - - this.addTemplate( - 'parent', - ` - - Parent - - {{outlet}} - ` - ); - - this.add( - 'controller:parent', - class extends Controller { - queryParams = ['page']; - page = 1; - } - ); - - await this.visit('/'); - - appLink = this.$('#app-link'); - - assert.equal(appLink.attr('href'), '/parent'); - this.shouldNotBeActive(assert, '#app-link'); - - await this.visit('/parent?page=2'); - - appLink = this.$('#app-link'); - let router = this.appRouter; - - assert.equal(appLink.attr('href'), '/parent'); - this.shouldBeActive(assert, '#app-link'); - assert.equal(this.$('#parent-link').attr('href'), '/parent'); - this.shouldBeActive(assert, '#parent-link'); - - let parentController = this.getController('parent'); - - assert.equal(parentController.get('page'), 2); - - runTask(() => parentController.set('page', 3)); - await runLoopSettled(); - - assert.equal(router.get('location.path'), '/parent?page=3'); - this.shouldBeActive(assert, '#app-link'); - this.shouldBeActive(assert, '#parent-link'); - - await this.click('#app-link'); - - assert.equal(router.get('location.path'), '/parent'); - } - - async ['@test it defaults query params while in active transition regression test']( - assert - ) { - this.router.map(function () { - this.route('foos'); - this.route('bars'); - }); - - let foos = RSVP.defer(); - let bars = RSVP.defer(); - - this.addTemplate( - 'application', - ` - Foos - Baz Foos - Quux Bars - ` - ); - - this.add( - 'controller:foos', - class extends Controller { - queryParams = ['status']; - baz = false; - } - ); - - this.add( - 'route:foos', - class extends Route { - model() { - return foos.promise; - } - } - ); - - this.add( - 'controller:bars', - class extends Controller { - queryParams = ['status']; - quux = false; - } - ); - - this.add( - 'route:bars', - class extends Route { - model() { - return bars.promise; - } - } - ); - - await this.visit('/'); - - let router = this.appRouter; - let foosLink = this.$('#foos-link'); - let barsLink = this.$('#bars-link'); - let bazLink = this.$('#baz-foos-link'); - - assert.equal(foosLink.attr('href'), '/foos'); - assert.equal(bazLink.attr('href'), '/foos?baz=true'); - assert.equal(barsLink.attr('href'), '/bars?quux=true'); - assert.equal(router.get('location.path'), '/'); - this.shouldNotBeActive(assert, '#foos-link'); - this.shouldNotBeActive(assert, '#baz-foos-link'); - this.shouldNotBeActive(assert, '#bars-link'); - - runTask(() => barsLink.click()); - this.shouldNotBeActive(assert, '#bars-link'); - - runTask(() => foosLink.click()); - this.shouldNotBeActive(assert, '#foos-link'); - - runTask(() => foos.resolve()); - - assert.equal(router.get('location.path'), '/foos'); - this.shouldBeActive(assert, '#foos-link'); - } - - async ['@test it does not throw an error if called without a @route argument, but with a @query argument']( - assert - ) { - this.addTemplate( - 'index', - ` - - Index - - ` - ); - - this.add( - 'route:index', - class extends Route { - model() { - return [ - { id: 'yehuda', name: 'Yehuda Katz' }, - { id: 'tom', name: 'Tom Dale' }, - { id: 'erik', name: 'Erik Brynroflsson' }, - ]; - } - } - ); - - this.add( - 'controller:index', - class extends Controller { - queryParams = ['page']; - page = 1; - pageNumber = 5; - } - ); - - await this.visit('/'); - - this.shouldNotBeActive(assert, '#page-link'); - - await this.visit('/?page=5'); - - this.shouldBeActive(assert, '#page-link'); - } - - async ['@test with dynamic segment and loading route, it should preserve query parameters']( - assert - ) { - this.router.map(function () { - this.route('foo', { path: ':foo' }, function () { - this.route('bar', function () { - this.route('baz'); - }); - }); - }); - - this.addTemplate( - 'foo.bar', - `Baz` - ); - - this.addTemplate('foo.bar.loading', 'Loading'); - - this.add( - 'controller:foo.bar', - class extends Controller { - queryParams = ['qux']; - qux = null; - } - ); - - this.add( - 'route:foo.bar.baz', - class extends Route { - model() { - return new RSVP.Promise((resolve) => { - setTimeout(resolve, 1); - }); - } - } - ); - - await this.visit('/foo/bar/baz?qux=abc'); - - let bazLink = this.$('#baz-link'); - assert.equal(bazLink.attr('href'), '/foo/bar/baz?qux=abc'); - } - } -); +// moduleFor( +// ' component with query params (routing)', +// class extends ApplicationTestCase { +// constructor(...args) { +// super(...args); + +// let indexProperties = { +// foo: '123', +// bar: 'abc', +// }; + +// this.add( +// 'controller:index', +// class extends Controller { +// queryParams = ['foo', 'bar', 'abool']; +// foo = indexProperties.foo; +// bar = indexProperties.bar; +// boundThing = 'OMG'; +// abool = true; +// } +// ); + +// this.add( +// 'controller:about', +// class extends Controller { +// queryParams = ['baz', 'bat']; +// baz = 'alex'; +// bat = 'borf'; +// } +// ); + +// this.indexProperties = indexProperties; +// } + +// shouldNotBeActive(assert, selector) { +// this.checkActive(assert, selector, false); +// } + +// shouldBeActive(assert, selector) { +// this.checkActive(assert, selector, true); +// } + +// getController(name) { +// return this.applicationInstance.lookup(`controller:${name}`); +// } + +// checkActive(assert, selector, active) { +// let classList = this.$(selector)[0].className; +// assert.equal( +// classList.indexOf('active') > -1, +// active, +// selector + ' active should be ' + active.toString() +// ); +// } + +// async [`@test it doesn't update controller QP properties on current route when invoked`]( +// assert +// ) { +// this.addTemplate( +// 'index', +// `Index` +// ); + +// await this.visit('/'); + +// await this.click('#the-link'); + +// let indexController = this.getController('index'); + +// assert.deepEqual( +// indexController.getProperties('foo', 'bar'), +// this.indexProperties, +// 'controller QP properties do not update' +// ); +// } + +// async [`@test it doesn't update controller QP properties on current route when invoked (empty query-params obj)`]( +// assert +// ) { +// this.addTemplate( +// 'index', +// `Index` +// ); + +// await this.visit('/'); + +// await this.click('#the-link'); + +// let indexController = this.getController('index'); + +// assert.deepEqual( +// indexController.getProperties('foo', 'bar'), +// this.indexProperties, +// 'controller QP properties do not update' +// ); +// } + +// async [`@test it doesn't update controller QP properties on current route when invoked (empty query-params obj, inferred route)`]( +// assert +// ) { +// this.addTemplate( +// 'index', +// `Index` +// ); + +// await this.visit('/'); + +// await this.click('#the-link'); + +// let indexController = this.getController('index'); + +// assert.deepEqual( +// indexController.getProperties('foo', 'bar'), +// this.indexProperties, +// 'controller QP properties do not update' +// ); +// } + +// async ['@test it updates controller QP properties on current route when invoked']( +// assert +// ) { +// this.addTemplate( +// 'index', +// ` +// +// Index +// +// ` +// ); + +// await this.visit('/'); + +// await this.click('#the-link'); + +// let indexController = this.getController('index'); + +// assert.deepEqual( +// indexController.getProperties('foo', 'bar'), +// { foo: '456', bar: 'abc' }, +// 'controller QP properties updated' +// ); +// } + +// async ['@test it updates controller QP properties on current route when invoked (inferred route)']( +// assert +// ) { +// this.addTemplate( +// 'index', +// ` +// +// Index +// +// ` +// ); + +// await this.visit('/'); + +// await this.click('#the-link'); + +// let indexController = this.getController('index'); + +// assert.deepEqual( +// indexController.getProperties('foo', 'bar'), +// { foo: '456', bar: 'abc' }, +// 'controller QP properties updated' +// ); +// } + +// async ['@test it updates controller QP properties on other route after transitioning to that route']( +// assert +// ) { +// this.router.map(function () { +// this.route('about'); +// }); + +// this.addTemplate( +// 'index', +// ` +// +// About +// +// ` +// ); + +// await this.visit('/'); + +// let theLink = this.$('#the-link'); + +// assert.equal(theLink.attr('href'), '/about?baz=lol'); + +// runTask(() => this.click('#the-link')); + +// let aboutController = this.getController('about'); + +// assert.deepEqual( +// aboutController.getProperties('baz', 'bat'), +// { baz: 'lol', bat: 'borf' }, +// 'about controller QP properties updated' +// ); +// } + +// async ['@test it generates proper href for `LinkTo` with no @route after transitioning to an error route [GH#17963]']( +// assert +// ) { +// this.router.map(function () { +// this.route('bad'); +// }); + +// this.add( +// 'controller:application', +// class extends Controller { +// queryParams = ['baz']; +// } +// ); + +// this.add( +// 'route:bad', +// class extends Route { +// model() { +// throw new Error('bad!'); +// } +// } +// ); + +// this.addTemplate('error', `Error: {{@model.message}}`); + +// this.addTemplate( +// 'application', +// ` +// +// Bad +// + +// +// Good +// + +// {{outlet}} +// ` +// ); + +// await this.visit('/'); + +// assert.equal( +// this.$('#good-link').length, +// 1, +// 'good-link should be in the DOM' +// ); +// assert.equal( +// this.$('#bad-link').length, +// 1, +// 'bad-link should be in the DOM' +// ); + +// let goodLink = this.$('#good-link'); +// assert.equal(goodLink.attr('href'), '/?baz=lol'); + +// await this.visit('/bad'); + +// assert.equal( +// this.$('#good-link').length, +// 1, +// 'good-link should be in the DOM' +// ); +// assert.equal( +// this.$('#bad-link').length, +// 1, +// 'bad-link should be in the DOM' +// ); + +// goodLink = this.$('#good-link'); +// // should still be / because we never entered /bad (it errored before being fully entered) +// // and error states do not get represented in the URL, so we are _effectively_ still +// // on / +// assert.equal(goodLink.attr('href'), '/?baz=lol'); + +// runTask(() => this.click('#good-link')); + +// let applicationController = this.getController('application'); +// assert.deepEqual( +// applicationController.getProperties('baz'), +// { baz: 'lol' }, +// 'index controller QP properties updated' +// ); +// } + +// async ['@test supplied QP properties can be bound'](assert) { +// this.addTemplate( +// 'index', +// ` +// +// Index +// +// ` +// ); + +// await this.visit('/'); + +// let indexController = this.getController('index'); +// let theLink = this.$('#the-link'); + +// assert.equal(theLink.attr('href'), '/?foo=OMG'); + +// runTask(() => indexController.set('boundThing', 'ASL')); + +// assert.equal(theLink.attr('href'), '/?foo=ASL'); +// } + +// async ['@test supplied QP properties can be bound (booleans)'](assert) { +// this.addTemplate( +// 'index', +// ` +// +// Index +// +// ` +// ); + +// await this.visit('/'); + +// let indexController = this.getController('index'); +// let theLink = this.$('#the-link'); + +// assert.equal(theLink.attr('href'), '/?abool=OMG'); + +// runTask(() => indexController.set('boundThing', false)); + +// assert.equal(theLink.attr('href'), '/?abool=false'); + +// await this.click('#the-link'); + +// assert.deepEqual( +// indexController.getProperties('foo', 'bar', 'abool'), +// { foo: '123', bar: 'abc', abool: false }, +// 'bound bool QP properties update' +// ); +// } + +// async ['@test href updates when unsupplied controller QP props change']( +// assert +// ) { +// this.addTemplate( +// 'index', +// ` +// +// Index +// +// ` +// ); + +// await this.visit('/'); + +// let indexController = this.getController('index'); +// let theLink = this.$('#the-link'); + +// assert.equal(theLink.attr('href'), '/?foo=lol'); + +// runTask(() => indexController.set('bar', 'BORF')); +// await runLoopSettled(); + +// assert.equal(theLink.attr('href'), '/?bar=BORF&foo=lol'); + +// runTask(() => indexController.set('foo', 'YEAH')); +// await runLoopSettled(); + +// assert.equal(theLink.attr('href'), '/?bar=BORF&foo=lol'); +// } + +// async ['@test [GH#12033] with only query params, it always transitions to the current route with the query params applied']( +// assert +// ) { +// this.addTemplate( +// 'cars', +// ` +// Create new car +// Page 2 +// {{outlet}} +// ` +// ); + +// this.addTemplate( +// 'cars.create', +// `Close create form` +// ); + +// this.router.map(function () { +// this.route('cars', function () { +// this.route('create'); +// }); +// }); + +// this.add( +// 'controller:cars', +// class extends Controller { +// queryParams = ['page']; +// page = 1; +// } +// ); + +// await this.visit('/cars/create'); + +// let router = this.appRouter; +// let carsController = this.getController('cars'); + +// assert.equal(router.currentRouteName, 'cars.create'); + +// runTask(() => this.click('#close-link')); + +// assert.equal(router.currentRouteName, 'cars.index'); +// assert.equal(router.get('url'), '/cars'); +// assert.equal(carsController.get('page'), 1, 'The page query-param is 1'); + +// runTask(() => this.click('#page2-link')); + +// assert.equal( +// router.currentRouteName, +// 'cars.index', +// 'The active route is still cars' +// ); +// assert.equal( +// router.get('url'), +// '/cars?page=2', +// 'The url has been updated' +// ); +// assert.equal( +// carsController.get('page'), +// 2, +// 'The query params have been updated' +// ); +// } + +// async ['@test it applies activeClass when query params are not changed']( +// assert +// ) { +// this.addTemplate( +// 'index', +// ` +// Index +// Index +// Index +// ` +// ); + +// this.addTemplate( +// 'search', +// ` +// Index +// Index +// Index +// Index +// Index +// Index +// Index +// {{outlet}} +// ` +// ); + +// this.addTemplate( +// 'search.results', +// ` +// Index +// Index +// Index +// Index +// Index +// Index +// Index +// ` +// ); + +// this.router.map(function () { +// this.route('search', function () { +// this.route('results'); +// }); +// }); + +// this.add( +// 'controller:search', +// class extends Controller { +// queryParams = ['search', 'archive']; +// search = ''; +// archive = false; +// } +// ); + +// this.add( +// 'controller:search.results', +// class extends Controller { +// queryParams = ['sort', 'showDetails']; +// sort = 'title'; +// showDetails = true; +// } +// ); + +// await this.visit('/'); + +// this.shouldNotBeActive(assert, '#cat-link'); +// this.shouldNotBeActive(assert, '#dog-link'); + +// await this.visit('/?foo=cat'); + +// this.shouldBeActive(assert, '#cat-link'); +// this.shouldNotBeActive(assert, '#dog-link'); + +// await this.visit('/?foo=dog'); + +// this.shouldBeActive(assert, '#dog-link'); +// this.shouldNotBeActive(assert, '#cat-link'); +// this.shouldBeActive(assert, '#change-nothing'); + +// await this.visit('/search?search=same'); + +// this.shouldBeActive(assert, '#same-search'); +// this.shouldNotBeActive(assert, '#change-search'); +// this.shouldNotBeActive(assert, '#same-search-add-archive'); +// this.shouldNotBeActive(assert, '#only-add-archive'); +// this.shouldNotBeActive(assert, '#remove-one'); + +// await this.visit('/search?search=same&archive=true'); + +// this.shouldBeActive(assert, '#both-same'); +// this.shouldNotBeActive(assert, '#change-one'); + +// await this.visit( +// '/search/results?search=same&sort=title&showDetails=true' +// ); + +// this.shouldBeActive(assert, '#same-sort-child-only'); +// this.shouldBeActive(assert, '#same-search-parent-only'); +// this.shouldNotBeActive(assert, '#change-search-parent-only'); +// this.shouldBeActive(assert, '#same-search-same-sort-child-and-parent'); +// this.shouldNotBeActive( +// assert, +// '#same-search-different-sort-child-and-parent' +// ); +// this.shouldNotBeActive( +// assert, +// '#change-search-same-sort-child-and-parent' +// ); +// } + +// async ['@test it applies active class when query-param is a number']( +// assert +// ) { +// this.addTemplate( +// 'index', +// ` +// +// Index +// +// ` +// ); + +// this.add( +// 'controller:index', +// class extends Controller { +// queryParams = ['page']; +// page = 1; +// pageNumber = 5; +// } +// ); + +// await this.visit('/'); + +// this.shouldNotBeActive(assert, '#page-link'); + +// await this.visit('/?page=5'); + +// this.shouldBeActive(assert, '#page-link'); +// } + +// async ['@test it applies active class when query-param is an array']( +// assert +// ) { +// this.addTemplate( +// 'index', +// ` +// Index +// Index +// Index +// ` +// ); + +// this.add( +// 'controller:index', +// class extends Controller { +// queryParams = ['pages']; +// pages = []; +// pagesArray = [1, 2]; +// biggerArray = [1, 2, 3]; +// emptyArray = []; +// } +// ); + +// await this.visit('/'); + +// this.shouldNotBeActive(assert, '#array-link'); + +// await this.visit('/?pages=%5B1%2C2%5D'); + +// this.shouldBeActive(assert, '#array-link'); +// this.shouldNotBeActive(assert, '#bigger-link'); +// this.shouldNotBeActive(assert, '#empty-link'); + +// await this.visit('/?pages=%5B2%2C1%5D'); + +// this.shouldNotBeActive(assert, '#array-link'); +// this.shouldNotBeActive(assert, '#bigger-link'); +// this.shouldNotBeActive(assert, '#empty-link'); + +// await this.visit('/?pages=%5B1%2C2%2C3%5D'); + +// this.shouldBeActive(assert, '#bigger-link'); +// this.shouldNotBeActive(assert, '#array-link'); +// this.shouldNotBeActive(assert, '#empty-link'); +// } + +// async ['@test it applies active class to the parent route'](assert) { +// this.router.map(function () { +// this.route('parent', function () { +// this.route('child'); +// }); +// }); + +// this.addTemplate( +// 'application', +// ` +// Parent +// Child +// Parent +// {{outlet}} +// ` +// ); + +// this.add( +// 'controller:parent.child', +// class extends Controller { +// queryParams = ['foo']; +// foo = 'bar'; +// } +// ); + +// await this.visit('/'); + +// this.shouldNotBeActive(assert, '#parent-link'); +// this.shouldNotBeActive(assert, '#parent-child-link'); +// this.shouldNotBeActive(assert, '#parent-link-qp'); + +// await this.visit('/parent/child?foo=dog'); + +// this.shouldBeActive(assert, '#parent-link'); +// this.shouldNotBeActive(assert, '#parent-link-qp'); +// } + +// async ['@test it disregards query-params in activeness computation when current-when is specified']( +// assert +// ) { +// let appLink; + +// this.router.map(function () { +// this.route('parent'); +// }); + +// this.addTemplate( +// 'application', +// ` +// +// Parent +// +// {{outlet}} +// ` +// ); + +// this.addTemplate( +// 'parent', +// ` +// +// Parent +// +// {{outlet}} +// ` +// ); + +// this.add( +// 'controller:parent', +// class extends Controller { +// queryParams = ['page']; +// page = 1; +// } +// ); + +// await this.visit('/'); + +// appLink = this.$('#app-link'); + +// assert.equal(appLink.attr('href'), '/parent'); +// this.shouldNotBeActive(assert, '#app-link'); + +// await this.visit('/parent?page=2'); + +// appLink = this.$('#app-link'); +// let router = this.appRouter; + +// assert.equal(appLink.attr('href'), '/parent'); +// this.shouldBeActive(assert, '#app-link'); +// assert.equal(this.$('#parent-link').attr('href'), '/parent'); +// this.shouldBeActive(assert, '#parent-link'); + +// let parentController = this.getController('parent'); + +// assert.equal(parentController.get('page'), 2); + +// runTask(() => parentController.set('page', 3)); +// await runLoopSettled(); + +// assert.equal(router.get('location.path'), '/parent?page=3'); +// this.shouldBeActive(assert, '#app-link'); +// this.shouldBeActive(assert, '#parent-link'); + +// await this.click('#app-link'); + +// assert.equal(router.get('location.path'), '/parent'); +// } + +// async ['@test it defaults query params while in active transition regression test']( +// assert +// ) { +// this.router.map(function () { +// this.route('foos'); +// this.route('bars'); +// }); + +// let foos = RSVP.defer(); +// let bars = RSVP.defer(); + +// this.addTemplate( +// 'application', +// ` +// Foos +// Baz Foos +// Quux Bars +// ` +// ); + +// this.add( +// 'controller:foos', +// class extends Controller { +// queryParams = ['status']; +// baz = false; +// } +// ); + +// this.add( +// 'route:foos', +// class extends Route { +// model() { +// return foos.promise; +// } +// } +// ); + +// this.add( +// 'controller:bars', +// class extends Controller { +// queryParams = ['status']; +// quux = false; +// } +// ); + +// this.add( +// 'route:bars', +// class extends Route { +// model() { +// return bars.promise; +// } +// } +// ); + +// await this.visit('/'); + +// let router = this.appRouter; +// let foosLink = this.$('#foos-link'); +// let barsLink = this.$('#bars-link'); +// let bazLink = this.$('#baz-foos-link'); + +// assert.equal(foosLink.attr('href'), '/foos'); +// assert.equal(bazLink.attr('href'), '/foos?baz=true'); +// assert.equal(barsLink.attr('href'), '/bars?quux=true'); +// assert.equal(router.get('location.path'), '/'); +// this.shouldNotBeActive(assert, '#foos-link'); +// this.shouldNotBeActive(assert, '#baz-foos-link'); +// this.shouldNotBeActive(assert, '#bars-link'); + +// runTask(() => barsLink.click()); +// this.shouldNotBeActive(assert, '#bars-link'); + +// runTask(() => foosLink.click()); +// this.shouldNotBeActive(assert, '#foos-link'); + +// runTask(() => foos.resolve()); + +// assert.equal(router.get('location.path'), '/foos'); +// this.shouldBeActive(assert, '#foos-link'); +// } + +// async ['@test it does not throw an error if called without a @route argument, but with a @query argument']( +// assert +// ) { +// this.addTemplate( +// 'index', +// ` +// +// Index +// +// ` +// ); + +// this.add( +// 'route:index', +// class extends Route { +// model() { +// return [ +// { id: 'yehuda', name: 'Yehuda Katz' }, +// { id: 'tom', name: 'Tom Dale' }, +// { id: 'erik', name: 'Erik Brynroflsson' }, +// ]; +// } +// } +// ); + +// this.add( +// 'controller:index', +// class extends Controller { +// queryParams = ['page']; +// page = 1; +// pageNumber = 5; +// } +// ); + +// await this.visit('/'); + +// this.shouldNotBeActive(assert, '#page-link'); + +// await this.visit('/?page=5'); + +// this.shouldBeActive(assert, '#page-link'); +// } + +// async ['@test with dynamic segment and loading route, it should preserve query parameters']( +// assert +// ) { +// this.router.map(function () { +// this.route('foo', { path: ':foo' }, function () { +// this.route('bar', function () { +// this.route('baz'); +// }); +// }); +// }); + +// this.addTemplate( +// 'foo.bar', +// `Baz` +// ); + +// this.addTemplate('foo.bar.loading', 'Loading'); + +// this.add( +// 'controller:foo.bar', +// class extends Controller { +// queryParams = ['qux']; +// qux = null; +// } +// ); + +// this.add( +// 'route:foo.bar.baz', +// class extends Route { +// model() { +// return new RSVP.Promise((resolve) => { +// setTimeout(resolve, 1); +// }); +// } +// } +// ); + +// await this.visit('/foo/bar/baz?qux=abc'); + +// let bazLink = this.$('#baz-link'); +// assert.equal(bazLink.attr('href'), '/foo/bar/baz?qux=abc'); +// } +// } +// ); diff --git a/tests/integration/components/link-to/query-params-curly-test.js b/tests/integration/components/link-to/query-params-curly-test.js index 7cbaebc..7e8bb02 100644 --- a/tests/integration/components/link-to/query-params-curly-test.js +++ b/tests/integration/components/link-to/query-params-curly-test.js @@ -3,8 +3,8 @@ /* eslint-disable ember/no-classic-classes */ /* eslint-disable ember/no-test-module-for */ import Controller from '@ember/controller'; -import { RSVP } from '@ember/-internals/runtime'; -import { Route } from '@ember/-internals/routing'; +import RSVP from 'rsvp'; +import Route from '@ember/routing/route'; import { DEBUG } from '@glimmer/env'; import { ApplicationTestCase, diff --git a/tests/integration/components/link-to/rendering-angle-test.js b/tests/integration/components/link-to/rendering-angle-test.js index b70bb51..7a6bdc4 100644 --- a/tests/integration/components/link-to/rendering-angle-test.js +++ b/tests/integration/components/link-to/rendering-angle-test.js @@ -12,10 +12,11 @@ import { RouterNonApplicationTestCase, runTask, } from '@ember/test-helpers'; -import { Router, Route } from '@ember/-internals/routing'; +import Route from '@ember/routing/route'; +import Router from '@ember/routing/router'; import Controller from '@ember/controller'; -import { set } from '@ember/-internals/metal'; -import { LinkComponent } from '@ember/-internals/glimmer'; +import { set } from '@ember/object'; +import LinkComponent from 'ember-legacy-built-in-components/components/link-to'; moduleFor( ' component (rendering tests)', diff --git a/tests/integration/components/link-to/rendering-curly-test.js b/tests/integration/components/link-to/rendering-curly-test.js index 8ae3a85..6404721 100644 --- a/tests/integration/components/link-to/rendering-curly-test.js +++ b/tests/integration/components/link-to/rendering-curly-test.js @@ -15,8 +15,8 @@ import { } from '@ember/test-helpers'; import Controller from '@ember/controller'; -import { set } from '@ember/-internals/metal'; -import { LinkComponent } from '@ember/-internals/glimmer'; +import { set } from '@ember/object'; +import LinkComponent from 'ember-legacy-built-in-components/components/link-to'; moduleFor( '{{link-to}} component (rendering tests)', diff --git a/tests/integration/components/link-to/routing-angle-test.js b/tests/integration/components/link-to/routing-angle-test.js index 4abf3a2..57c135a 100644 --- a/tests/integration/components/link-to/routing-angle-test.js +++ b/tests/integration/components/link-to/routing-angle-test.js @@ -1,6 +1,7 @@ /* eslint-disable ember/no-jquery */ /* eslint-disable ember/no-test-module-for */ import { + compile, ApplicationTestCase, ModuleBasedTestResolver, moduleFor, @@ -10,13 +11,14 @@ import { expectWarning, } from '@ember/test-helpers'; import Controller, { inject as injectController } from '@ember/controller'; -import { A as emberA, RSVP } from '@ember/-internals/runtime'; +import { A as emberA } from '@ember/array'; +import RSVP from 'rsvp'; import { subscribe, reset } from '@ember/instrumentation'; -import { Route, NoneLocation } from '@ember/-internals/routing'; -import { EMBER_IMPROVED_INSTRUMENTATION } from '@ember/canary-features'; +import Route from '@ember/routing/route'; +import NoneLocation from '@ember/routing/none-location'; +// import { EMBER_IMPROVED_INSTRUMENTATION } from '@ember/canary-features'; import Engine from '@ember/engine'; import { DEBUG } from '@glimmer/env'; -import { compile } from '../../../utils/helpers'; // IE includes the host name function normalizeUrl(url) { @@ -864,140 +866,140 @@ moduleFor( } ); -if (EMBER_IMPROVED_INSTRUMENTATION) { - moduleFor( - 'The component with EMBER_IMPROVED_INSTRUMENTATION', - class extends ApplicationTestCase { - constructor() { - super(); - - this.router.map(function () { - this.route('about'); - }); - - this.addTemplate( - 'index', - ` -

Home

- About - Self - ` - ); - this.addTemplate( - 'about', - ` -

About

- Home - Self - ` - ); - } - - beforeEach() { - return this.visit('/'); - } - - afterEach() { - reset(); - - return super.afterEach(); - } - - async ['@test it fires an interaction event'](assert) { - let before = 0; - let after = 0; - - subscribe('interaction.link-to', { - before() { - before++; - }, - after() { - after++; - }, - }); - - assert.strictEqual( - before, - 0, - 'instrumentation subscriber (before) was not called' - ); - assert.strictEqual( - after, - 0, - 'instrumentation subscriber (after) was not called' - ); - - await this.click('#about-link'); - - assert.strictEqual( - before, - 1, - 'instrumentation subscriber (before) was called' - ); - assert.strictEqual( - after, - 1, - 'instrumentation subscriber (after) was called' - ); - } - - async ['@test it interaction event includes the route name and transition object']( - assert - ) { - let before = 0; - let after = 0; - - subscribe('interaction.link-to', { - before(name, timestamp, { routeName }) { - before++; - assert.equal( - routeName, - 'about', - 'instrumentation subscriber was passed route name' - ); - }, - after(name, timestamp, { routeName, transition }) { - after++; - assert.equal( - routeName, - 'about', - 'instrumentation subscriber was passed route name' - ); - assert.equal( - transition.targetName, - 'about', - 'instrumentation subscriber was passed transition object in the after hook' - ); - }, - }); - - assert.strictEqual( - before, - 0, - 'instrumentation subscriber (before) was not called' - ); - assert.strictEqual( - after, - 0, - 'instrumentation subscriber (after) was not called' - ); - - await this.click('#about-link'); - - assert.strictEqual( - before, - 1, - 'instrumentation subscriber (before) was called' - ); - assert.strictEqual( - after, - 1, - 'instrumentation subscriber (after) was called' - ); - } - } - ); -} +// if (EMBER_IMPROVED_INSTRUMENTATION) { +// moduleFor( +// 'The component with EMBER_IMPROVED_INSTRUMENTATION', +// class extends ApplicationTestCase { +// constructor() { +// super(); + +// this.router.map(function () { +// this.route('about'); +// }); + +// this.addTemplate( +// 'index', +// ` +//

Home

+// About +// Self +// ` +// ); +// this.addTemplate( +// 'about', +// ` +//

About

+// Home +// Self +// ` +// ); +// } + +// beforeEach() { +// return this.visit('/'); +// } + +// afterEach() { +// reset(); + +// return super.afterEach(); +// } + +// async ['@test it fires an interaction event'](assert) { +// let before = 0; +// let after = 0; + +// subscribe('interaction.link-to', { +// before() { +// before++; +// }, +// after() { +// after++; +// }, +// }); + +// assert.strictEqual( +// before, +// 0, +// 'instrumentation subscriber (before) was not called' +// ); +// assert.strictEqual( +// after, +// 0, +// 'instrumentation subscriber (after) was not called' +// ); + +// await this.click('#about-link'); + +// assert.strictEqual( +// before, +// 1, +// 'instrumentation subscriber (before) was called' +// ); +// assert.strictEqual( +// after, +// 1, +// 'instrumentation subscriber (after) was called' +// ); +// } + +// async ['@test it interaction event includes the route name and transition object']( +// assert +// ) { +// let before = 0; +// let after = 0; + +// subscribe('interaction.link-to', { +// before(name, timestamp, { routeName }) { +// before++; +// assert.equal( +// routeName, +// 'about', +// 'instrumentation subscriber was passed route name' +// ); +// }, +// after(name, timestamp, { routeName, transition }) { +// after++; +// assert.equal( +// routeName, +// 'about', +// 'instrumentation subscriber was passed route name' +// ); +// assert.equal( +// transition.targetName, +// 'about', +// 'instrumentation subscriber was passed transition object in the after hook' +// ); +// }, +// }); + +// assert.strictEqual( +// before, +// 0, +// 'instrumentation subscriber (before) was not called' +// ); +// assert.strictEqual( +// after, +// 0, +// 'instrumentation subscriber (after) was not called' +// ); + +// await this.click('#about-link'); + +// assert.strictEqual( +// before, +// 1, +// 'instrumentation subscriber (before) was called' +// ); +// assert.strictEqual( +// after, +// 1, +// 'instrumentation subscriber (after) was called' +// ); +// } +// } +// ); +// } moduleFor( 'The component - nested routes and link-to arguments', diff --git a/tests/integration/components/link-to/routing-curly-test.js b/tests/integration/components/link-to/routing-curly-test.js index ceb3563..e6bbe45 100644 --- a/tests/integration/components/link-to/routing-curly-test.js +++ b/tests/integration/components/link-to/routing-curly-test.js @@ -3,6 +3,7 @@ /* eslint-disable ember/no-classic-classes */ /* eslint-disable ember/no-test-module-for */ import { + compile, ApplicationTestCase, ModuleBasedTestResolver, moduleFor, @@ -12,13 +13,14 @@ import { expectWarning, } from '@ember/test-helpers'; import Controller, { inject as injectController } from '@ember/controller'; -import { A as emberA, RSVP } from '@ember/-internals/runtime'; -import { subscribe, reset } from '@ember/instrumentation'; -import { Route, NoneLocation } from '@ember/-internals/routing'; -import { EMBER_IMPROVED_INSTRUMENTATION } from '@ember/canary-features'; +import { A } from '@ember/array'; +import RSVP from 'rsvp'; +// import { subscribe, reset } from '@ember/instrumentation'; +import Route from '@ember/routing/route'; +import NoneLocation from '@ember/routing/none-location'; +// import { EMBER_IMPROVED_INSTRUMENTATION } from '@ember/canary-features'; import Engine from '@ember/engine'; import { DEBUG } from '@glimmer/env'; -import { compile } from '../../../utils/helpers'; // IE includes the host name function normalizeUrl(url) { @@ -914,140 +916,140 @@ moduleFor( } ); -if (EMBER_IMPROVED_INSTRUMENTATION) { - moduleFor( - 'The {{link-to}} component with EMBER_IMPROVED_INSTRUMENTATION', - class extends ApplicationTestCase { - constructor() { - super(); - - this.router.map(function () { - this.route('about'); - }); - - this.addTemplate( - 'index', - ` -

Home

- - - ` - ); - this.addTemplate( - 'about', - ` -

About

- - - ` - ); - } - - beforeEach() { - return this.visit('/'); - } - - afterEach() { - reset(); - - return super.afterEach(); - } - - async ['@test it fires an interaction event'](assert) { - let before = 0; - let after = 0; - - subscribe('interaction.link-to', { - before() { - before++; - }, - after() { - after++; - }, - }); - - assert.strictEqual( - before, - 0, - 'instrumentation subscriber (before) was not called' - ); - assert.strictEqual( - after, - 0, - 'instrumentation subscriber (after) was not called' - ); - - await this.click('#about-link > a'); - - assert.strictEqual( - before, - 1, - 'instrumentation subscriber (before) was called' - ); - assert.strictEqual( - after, - 1, - 'instrumentation subscriber (after) was called' - ); - } - - async ['@test it interaction event includes the route name and transition object']( - assert - ) { - let before = 0; - let after = 0; - - subscribe('interaction.link-to', { - before(name, timestamp, { routeName }) { - before++; - assert.equal( - routeName, - 'about', - 'instrumentation subscriber was passed route name' - ); - }, - after(name, timestamp, { routeName, transition }) { - after++; - assert.equal( - routeName, - 'about', - 'instrumentation subscriber was passed route name' - ); - assert.equal( - transition.targetName, - 'about', - 'instrumentation subscriber was passed transition object in the after hook' - ); - }, - }); - - assert.strictEqual( - before, - 0, - 'instrumentation subscriber (before) was not called' - ); - assert.strictEqual( - after, - 0, - 'instrumentation subscriber (after) was not called' - ); - - await this.click('#about-link > a'); - - assert.strictEqual( - before, - 1, - 'instrumentation subscriber (before) was called' - ); - assert.strictEqual( - after, - 1, - 'instrumentation subscriber (after) was called' - ); - } - } - ); -} +// if (EMBER_IMPROVED_INSTRUMENTATION) { +// moduleFor( +// 'The {{link-to}} component with EMBER_IMPROVED_INSTRUMENTATION', +// class extends ApplicationTestCase { +// constructor() { +// super(); + +// this.router.map(function () { +// this.route('about'); +// }); + +// this.addTemplate( +// 'index', +// ` +//

Home

+// +// +// ` +// ); +// this.addTemplate( +// 'about', +// ` +//

About

+// +// +// ` +// ); +// } + +// beforeEach() { +// return this.visit('/'); +// } + +// afterEach() { +// reset(); + +// return super.afterEach(); +// } + +// async ['@test it fires an interaction event'](assert) { +// let before = 0; +// let after = 0; + +// subscribe('interaction.link-to', { +// before() { +// before++; +// }, +// after() { +// after++; +// }, +// }); + +// assert.strictEqual( +// before, +// 0, +// 'instrumentation subscriber (before) was not called' +// ); +// assert.strictEqual( +// after, +// 0, +// 'instrumentation subscriber (after) was not called' +// ); + +// await this.click('#about-link > a'); + +// assert.strictEqual( +// before, +// 1, +// 'instrumentation subscriber (before) was called' +// ); +// assert.strictEqual( +// after, +// 1, +// 'instrumentation subscriber (after) was called' +// ); +// } + +// async ['@test it interaction event includes the route name and transition object']( +// assert +// ) { +// let before = 0; +// let after = 0; + +// subscribe('interaction.link-to', { +// before(name, timestamp, { routeName }) { +// before++; +// assert.equal( +// routeName, +// 'about', +// 'instrumentation subscriber was passed route name' +// ); +// }, +// after(name, timestamp, { routeName, transition }) { +// after++; +// assert.equal( +// routeName, +// 'about', +// 'instrumentation subscriber was passed route name' +// ); +// assert.equal( +// transition.targetName, +// 'about', +// 'instrumentation subscriber was passed transition object in the after hook' +// ); +// }, +// }); + +// assert.strictEqual( +// before, +// 0, +// 'instrumentation subscriber (before) was not called' +// ); +// assert.strictEqual( +// after, +// 0, +// 'instrumentation subscriber (after) was not called' +// ); + +// await this.click('#about-link > a'); + +// assert.strictEqual( +// before, +// 1, +// 'instrumentation subscriber (before) was called' +// ); +// assert.strictEqual( +// after, +// 1, +// 'instrumentation subscriber (after) was called' +// ); +// } +// } +// ); +// } moduleFor( 'The {{link-to}} component - nested routes and link-to arguments', diff --git a/tests/integration/components/link-to/transitioning-classes-angle-test.js b/tests/integration/components/link-to/transitioning-classes-angle-test.js index f7f3341..1f9494c 100644 --- a/tests/integration/components/link-to/transitioning-classes-angle-test.js +++ b/tests/integration/components/link-to/transitioning-classes-angle-test.js @@ -2,8 +2,8 @@ /* eslint-disable ember/require-tagless-components */ /* eslint-disable ember/no-classic-classes */ /* eslint-disable ember/no-test-module-for */ -import { RSVP } from '@ember/-internals/runtime'; -import { Route } from '@ember/-internals/routing'; +import RSVP from 'rsvp'; +import Route from '@ember/routing/route'; import { moduleFor, ApplicationTestCase, runTask } from '@ember/test-helpers'; function assertHasClass(assert, selector, label) { diff --git a/tests/integration/components/link-to/transitioning-classes-curly-test.js b/tests/integration/components/link-to/transitioning-classes-curly-test.js index 0f75c29..31bdea9 100644 --- a/tests/integration/components/link-to/transitioning-classes-curly-test.js +++ b/tests/integration/components/link-to/transitioning-classes-curly-test.js @@ -2,8 +2,8 @@ /* eslint-disable ember/require-tagless-components */ /* eslint-disable ember/no-classic-classes */ /* eslint-disable ember/no-test-module-for */ -import { RSVP } from '@ember/-internals/runtime'; -import { Route } from '@ember/-internals/routing'; +import RSVP from 'rsvp'; +import Route from '@ember/routing/route'; import { moduleFor, ApplicationTestCase, runTask } from '@ember/test-helpers'; function assertHasClass(assert, selector, label) { diff --git a/tests/integration/components/textarea-angle-test.js b/tests/integration/components/textarea-angle-test.js index 4bfe97d..0c733cb 100644 --- a/tests/integration/components/textarea-angle-test.js +++ b/tests/integration/components/textarea-angle-test.js @@ -12,7 +12,7 @@ import { import { action } from '@ember/object'; import { assign } from '@ember/polyfills'; -import { set } from '@ember/-internals/metal'; +import { set } from '@ember/object'; class TextAreaRenderingTest extends RenderingTestCase { assertTextArea({ attrs, value } = {}) { diff --git a/tests/integration/components/textarea-curly-test.js b/tests/integration/components/textarea-curly-test.js index 9542ade..932b8b6 100644 --- a/tests/integration/components/textarea-curly-test.js +++ b/tests/integration/components/textarea-curly-test.js @@ -1,12 +1,21 @@ -import { RenderingTestCase, moduleFor, classes, applyMixins, runTask } from 'internal-test-helpers'; +import { + RenderingTestCase, + moduleFor, + classes, + applyMixins, + runTask, +} from '@ember/test-helpers'; import { action } from '@ember/object'; import { assign } from '@ember/polyfills'; -import { set } from '@ember/-internals/metal'; +import { set } from '@ember/object'; class TextAreaRenderingTest extends RenderingTestCase { assertTextArea({ attrs, value } = {}) { - let mergedAttrs = assign({ class: classes('ember-view ember-text-area') }, attrs); + let mergedAttrs = assign( + { class: classes('ember-view ember-text-area') }, + attrs + ); this.assertComponentElement(this.firstChild, { tagName: 'textarea', attrs: mergedAttrs, @@ -113,7 +122,9 @@ moduleFor( runTask(() => set(this.context, 'model.val', 'Auckland')); this.assertTextArea({ value: 'Auckland' }); - runTask(() => set(this.context, 'model', { val: 'A beautiful day in Seattle' })); + runTask(() => + set(this.context, 'model', { val: 'A beautiful day in Seattle' }) + ); this.assertTextArea({ value: 'A beautiful day in Seattle' }); } @@ -159,11 +170,15 @@ moduleFor( }); this.assertTextArea({ value: 'Boston' }); - runTask(() => set(this.context, 'model', { val: 'A beautiful day in Seattle' })); + runTask(() => + set(this.context, 'model', { val: 'A beautiful day in Seattle' }) + ); this.assertTextArea({ value: 'A beautiful day in Seattle' }); } - ['@test triggers a method with `{{textarea key-up=this.didTrigger}}`'](assert) { + ['@test triggers a method with `{{textarea key-up=this.didTrigger}}`']( + assert + ) { this.render(`{{textarea key-up=this.didTrigger}}`, { didTrigger: action(function () { assert.ok(true, 'action was triggered');