Skip to content

Commit

Permalink
refactor: migrate test-app to TypeScript
Browse files Browse the repository at this point in the history
  • Loading branch information
vscav committed Oct 9, 2023

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
1 parent 8c2c0a9 commit 37a8b96
Showing 12 changed files with 84 additions and 55 deletions.
3 changes: 2 additions & 1 deletion test-app/app/app.js → test-app/app/app.ts
Original file line number Diff line number Diff line change
@@ -9,4 +9,5 @@ export default class App extends Application {
Resolver = Resolver;
}

loadInitializers(App, config.modulePrefix);
// eslint-disable-next-line @typescript-eslint/no-explicit-any
loadInitializers(App as any, config.modulePrefix);
6 changes: 4 additions & 2 deletions test-app/app/templates/application.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
<DocsHeader @prefix="ember" />
{{! @glint-nocheck }}

<DocsHeader @prefix='ember' />

{{outlet}}

<DocsKeyboardShortcuts />
<DocsKeyboardShortcuts />
16 changes: 9 additions & 7 deletions test-app/app/templates/docs.hbs
Original file line number Diff line number Diff line change
@@ -1,19 +1,21 @@
{{! @glint-nocheck }}

<DocsViewer as |viewer|>

<viewer.nav as |nav|>
<nav.section @label="Getting started"/>
<nav.item @label="Installation" @route="docs.installation" />
<nav.section @label='Getting started' />
<nav.item @label='Installation' @route='docs.installation' />

<nav.section @label="Components usage"/>
<nav.item @label="amount input" @route="docs.components.amount-input" />
<nav.section @label='Components usage' />
<nav.item @label='amount input' @route='docs.components.amount-input' />
</viewer.nav>

<viewer.main>
<div class="docs-container">
<div class="docs-section">
<div class='docs-container'>
<div class='docs-section'>
{{outlet}}
</div>
</div>
</viewer.main>

</DocsViewer>
</DocsViewer>
4 changes: 3 additions & 1 deletion test-app/app/templates/index.hbs
Original file line number Diff line number Diff line change
@@ -1 +1,3 @@
<DocsHero @byline="a simple money amount input" />
{{! @glint-nocheck }}

<DocsHero @byline='a simple money amount input' />
8 changes: 8 additions & 0 deletions test-app/config/ember-try.js
Original file line number Diff line number Diff line change
@@ -3,6 +3,11 @@
const getChannelURL = require('ember-source-channel-url');
const { embroiderSafe, embroiderOptimized } = require('@embroider/test-setup');

// Needed for ember-source < 4.8, when preview types were first shipped
const emberTypesPackages = {
'@types/ember__application': '^4.0.8',
};

module.exports = async function () {
return {
usePnpm: true,
@@ -12,6 +17,7 @@ module.exports = async function () {
npm: {
devDependencies: {
'ember-source': '~3.28.0',
...emberTypesPackages,
},
},
},
@@ -20,6 +26,7 @@ module.exports = async function () {
npm: {
devDependencies: {
'ember-source': '~4.4.0',
...emberTypesPackages,
},
},
},
@@ -75,6 +82,7 @@ module.exports = async function () {
npm: {
devDependencies: {
'ember-source': '~3.28.0',
...emberTypesPackages,
},
ember: {
edition: 'classic',
1 change: 1 addition & 0 deletions test-app/package.json
Original file line number Diff line number Diff line change
@@ -20,6 +20,7 @@
"lint:hbs:fix": "ember-template-lint . --fix",
"lint:js": "eslint . --cache",
"lint:js:fix": "eslint . --fix",
"lint:types": "glint",
"start": "ember serve",
"test": "concurrently \"pnpm:lint\" \"pnpm:test:*\" --names \"lint,test:\"",
"test:ember": "ember test"
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
import type { SetupTestOptions } from 'ember-qunit';
import {
setupApplicationTest as upstreamSetupApplicationTest,
setupRenderingTest as upstreamSetupRenderingTest,
@@ -8,7 +9,10 @@ import {
// test setup functions. This way, you can easily extend the setup that is
// needed per test type.

function setupApplicationTest(hooks, options) {
function setupApplicationTest(
hooks: NestedHooks,
options: SetupTestOptions,
): void {
upstreamSetupApplicationTest(hooks, options);

// Additional setup for application tests can be done here.
@@ -27,13 +31,16 @@ function setupApplicationTest(hooks, options) {
// setupMirage(hooks); // ember-cli-mirage
}

function setupRenderingTest(hooks, options) {
function setupRenderingTest(
hooks: NestedHooks,
options: SetupTestOptions,
): void {
upstreamSetupRenderingTest(hooks, options);

// Additional setup for rendering tests can be done here.
}

function setupTest(hooks, options) {
function setupTest(hooks: NestedHooks, options: SetupTestOptions): void {
upstreamSetupTest(hooks, options);

// Additional setup for unit tests can be done here.
Original file line number Diff line number Diff line change
@@ -1,29 +1,44 @@
import { module, test } from 'qunit';
import { setupRenderingTest } from 'ember-qunit';
import { blur, fillIn, render, typeIn } from '@ember/test-helpers';
import hbs from 'htmlbars-inline-precompile';
import { hbs } from 'ember-cli-htmlbars';
import type { TestContext as TestContextBase } from '@ember/test-helpers';

interface TestContext extends TestContextBase {
value: number | string;
update: () => void;
}

const NOOP = (): void => {};

module('Integration | Component | amount-input', function (hooks) {
setupRenderingTest(hooks);

test('is of type number', async function (assert) {
await render(hbs`
<AmountInput />
hooks.beforeEach(function (this: TestContext) {
this.update = NOOP;
});

test('is of type number', async function (this: TestContext, assert) {
await render<TestContext>(hbs`
<AmountInput
@value={{0}}
@update={{this.update}}
/>
`);

assert.dom('.amount-input').exists;
assert.dom('input').hasAttribute('type', 'number');
});

test('allows passing arguments', async function (assert) {
this.set('value', 1);
test('allows passing arguments', async function (this: TestContext, assert) {
this.value = 1;

await render(hbs`
await render<TestContext>(hbs`
<AmountInput
@inputId='abcd'
@currency="USD"
@currency='USD'
@numberOfDecimal={{0}}
@placeholder="1.000.000"
@placeholder='1.000.000'
@step={{1}}
@value={{this.value}}
@min={{5}}
@@ -45,14 +60,14 @@ module('Integration | Component | amount-input', function (hooks) {
assert.dom('input').hasAttribute('max', '10');
});

test('uses named property declared (even if undefined) instead of defaults', async function (assert) {
await render(hbs`
test('uses named property declared (even if undefined) instead of defaults', async function (this: TestContext, assert) {
await render<TestContext>(hbs`
<AmountInput
@currency={{this.isUndefined}}
@numberOfDecimal={{this.isUndefined}}
@placeholder={{this.isUndefined}}
@step={{this.isUndefined}}
@inputId={{this.isUndefined}}
@currency={{undefined}}
@numberOfDecimal={{undefined}}
@placeholder={{undefined}}
@step={{undefined}}
@inputId={{undefined}}
@value={{this.value}}
@update={{fn (mut this.value)}}
/>
@@ -68,8 +83,8 @@ module('Integration | Component | amount-input', function (hooks) {
assert.dom('input').hasValue('11');
});

test('uses defaults if named property are not declared', async function (assert) {
await render(hbs`
test('uses defaults if named property are not declared', async function (this: TestContext, assert) {
await render<TestContext>(hbs`
<AmountInput
@value={{this.value}}
@update={{fn (mut this.value)}}
@@ -86,8 +101,8 @@ module('Integration | Component | amount-input', function (hooks) {
assert.dom('input').hasValue('10.73');
});

test('does not type in when readonly attribute is set to true', async function (assert) {
await render(hbs`
test('does not type in when readonly attribute is set to true', async function (this: TestContext, assert) {
await render<TestContext>(hbs`
<AmountInput
@value={{this.value}}
@update={{fn (mut this.value)}}
@@ -98,8 +113,8 @@ module('Integration | Component | amount-input', function (hooks) {
assert.rejects(fillIn('input', '10.726'));
});

test('calls update with the formatted value on blur if the value is 0', async function (assert) {
await render(hbs`
test('calls update with the formatted value on blur if the value is 0', async function (this: TestContext, assert) {
await render<TestContext>(hbs`
<AmountInput
@numberOfDecimal={{1}}
@value={{this.value}}
@@ -112,10 +127,10 @@ module('Integration | Component | amount-input', function (hooks) {
assert.dom('input').hasValue('0.0');
});

test('masks `e`, `.` and `,` keys when `numberOfDecimal` argument is set to 0', async function (assert) {
this.set('value', 1);
test('masks `e`, `.` and `,` keys when `numberOfDecimal` argument is set to 0', async function (this: TestContext, assert) {
this.value = 1;

await render(hbs`
await render<TestContext>(hbs`
<AmountInput
@numberOfDecimal={{0}}
@value={{this.value}}
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import Application from '../app';
import config from '../config/environment';
import 'qunit-dom';
import Application from 'test-app/app';
import config from 'test-app/config/environment';
import { setApplication } from '@ember/test-helpers';
import { start } from 'ember-qunit';
import * as QUnit from 'qunit';
3 changes: 2 additions & 1 deletion test-app/types/glint.d.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import '@glint/environment-ember-loose';
import type AmountInputRegistry from 'ember-amount-input/template-registry';

declare module '@glint/environment-ember-loose/registry' {
export default interface Registry {}
export default interface Registry extends AmountInputRegistry {}
}
2 changes: 0 additions & 2 deletions test-app/types/index.d.ts

This file was deleted.

13 changes: 2 additions & 11 deletions test-app/types/test-app/index.d.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,2 @@
import type Ember from 'ember';

declare global {
// Prevents ESLint from "fixing" this via its auto-fix to turn it into a type
// alias (e.g. after running any Ember CLI generator)
// eslint-disable-next-line @typescript-eslint/no-empty-interface
interface Array<T> extends Ember.ArrayPrototypeExtensions<T> {}
// interface Function extends Ember.FunctionPrototypeExtensions {}
}

export {};
import 'ember-source/types';
import 'ember-source/types/preview';

0 comments on commit 37a8b96

Please sign in to comment.