1 | qunit-dom
|
2 | ==============================================================================
|
3 |
|
4 | [![TravisCI Build Status][travis-badge]][travis-badge-url]
|
5 | [![Latest NPM release][npm-badge]][npm-badge-url]
|
6 |
|
7 | [npm-badge]: https://img.shields.io/npm/v/qunit-dom.svg
|
8 | [npm-badge-url]: https://www.npmjs.com/package/qunit-dom
|
9 | [travis-badge]: https://img.shields.io/travis/simplabs/qunit-dom/master.svg
|
10 | [travis-badge-url]: https://travis-ci.org/simplabs/qunit-dom
|
11 |
|
12 | High Level DOM Assertions for [QUnit](https://qunitjs.com/)
|
13 |
|
14 | ```js
|
15 | assert.dom('h1').exists();
|
16 | assert.dom('h1').hasClass('title');
|
17 | assert.dom('h1').hasText('Welcome to Ember, John Doe!');
|
18 |
|
19 | assert.dom('input').isFocused();
|
20 | assert.dom('input').hasValue(/.+ Doe/);
|
21 | assert.dom('input').hasAttribute('type', 'text');
|
22 | ```
|
23 |
|
24 |
|
25 | Install
|
26 | ------------------------------------------------------------------------------
|
27 |
|
28 | ### npm
|
29 |
|
30 | ```bash
|
31 | npm install --save-dev qunit-dom
|
32 | ```
|
33 |
|
34 | or using [`yarn`](https://yarnpkg.com/):
|
35 |
|
36 | ```bash
|
37 | yarn add --dev qunit-dom
|
38 | ```
|
39 |
|
40 | ### Ember projects using `ember-qunit` v5.x and above
|
41 |
|
42 | Import and run the `setup` function in your `test-helper.js` file:
|
43 |
|
44 | ```js
|
45 | // tests/test-helper.js
|
46 | import * as QUnit from 'qunit';
|
47 | import { setup } from 'qunit-dom';
|
48 |
|
49 | //...
|
50 |
|
51 | setup(QUnit.assert);
|
52 |
|
53 | setApplication(Application.create(config.APP));
|
54 |
|
55 | start();
|
56 |
|
57 | //...
|
58 | ```
|
59 |
|
60 | This will attach the APIs to QUnit's `assert` object.
|
61 |
|
62 | ### Ember projects using `ember-qunit` v4.x and below
|
63 |
|
64 | `qunit-dom` will automatically attach the APIs to QUnit's `assert` object. No extra setup required :tada:.
|
65 |
|
66 | ### `<script>` Tag
|
67 |
|
68 | Load `qunit-dom.js` *after* `qunit.js`:
|
69 |
|
70 | ```html
|
71 | <script src="https://unpkg.com/qunitjs/qunit/qunit.js"></script>
|
72 | <script src="https://unpkg.com/qunit-dom/dist/qunit-dom.js"></script>
|
73 | ```
|
74 |
|
75 |
|
76 | Usage
|
77 | ------------------------------------------------------------------------------
|
78 |
|
79 | Once installed the DOM element assertions are available at `assert.dom(...).*`:
|
80 |
|
81 | ```js
|
82 | test('the title is welcoming', function(assert) {
|
83 | assert.dom('#title').hasText('Welcome to QUnit');
|
84 | });
|
85 | ```
|
86 |
|
87 | **All available assertions are documented in [API.md](API.md).**
|
88 |
|
89 | A basic codemod to automatically convert your assertions is available at
|
90 | [https://github.com/simplabs/qunit-dom-codemod](https://github.com/simplabs/qunit-dom-codemod).
|
91 |
|
92 |
|
93 | ### TypeScript
|
94 |
|
95 | `qunit-dom` includes type definition files, but the way it extends QUnit means
|
96 | that you need import it somewhere so that TS and your editor can pick up the
|
97 | types. It is recommended to add the following line to your
|
98 | `tests/test-helper.ts` file:
|
99 |
|
100 | ```
|
101 | import 'qunit-dom';
|
102 | ```
|
103 |
|
104 | Rename your `tests/test-helper.js` to `.ts` if you do not have such a
|
105 | file yet.
|
106 |
|
107 | Contributing
|
108 | ------------------------------------------------------------------------------
|
109 |
|
110 | See [CONTRIBUTING.md](CONTRIBUTING.md).
|
111 |
|
112 | Related
|
113 | ------------------------------------------------------------------------------
|
114 |
|
115 | - [chai-dom](https://github.com/nathanboktae/chai-dom) – DOM assertions for
|
116 | the Chai assertion library using vanilla JavaScript
|
117 | - [chai-jquery](https://github.com/chaijs/chai-jquery) – jQuery assertions
|
118 | for chai
|
119 |
|
120 |
|
121 | License
|
122 | ------------------------------------------------------------------------------
|
123 |
|
124 | qunit-dom is developed by and ©
|
125 | [simplabs GmbH](http://simplabs.com) and contributors. It is released under the
|
126 | [MIT License](https://github.com/simplabs/qunit-dom/blob/master/LICENSE.md).
|