Skip to content

Commit

Permalink
Removed unnecessary exported typing
Browse files Browse the repository at this point in the history
  • Loading branch information
squidfunk committed Mar 28, 2018
1 parent db64a76 commit 6219c4c
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 29 deletions.
4 changes: 4 additions & 0 deletions CHANGELOG
Original file line number Diff line number Diff line change
@@ -1,3 +1,7 @@
karma-viewport-1.0.2 (2018-03-28)

* Removed unnecessary exported typing

karma-viewport-1.0.1 (2018-03-27)

* Improved typings
Expand Down
51 changes: 24 additions & 27 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,11 @@
[gitter-image]: https://img.shields.io/gitter/room/squidfunk/karma-viewport.svg
[gitter-link]: https://gitter.im/squidfunk/karma-viewport
[npm-image]: https://img.shields.io/npm/v/karma-viewport.svg
[npm-link]: https://npmjs.com/packages/karma-viewport
[npm-link]: https://npmjs.com/package/karma-viewport

# karma-viewport

Karma viewport resizer for testing responsive features and layout.
Karma viewport resizer for testing responsive features and layout

## Installation

Expand All @@ -24,8 +24,6 @@ npm install karma-viewport

## Usage

### Basic configuration

Add `viewport` to the list of frameworks inside your Karma configuration:

``` js
Expand All @@ -37,8 +35,8 @@ module.exports = function(config) {
}
```

This will expose the global variable `viewport` which allows setting the
dimensions of the viewport within tests, e.g.:
This will expose the global variable `viewport` to your tests, which allows
setting the dimensions of the viewport, e.g.:

``` js
// Set to 320px x 100%
Expand All @@ -51,24 +49,12 @@ viewport.set(320, 480)
viewport.reset()
```

Remember to call `viewport.reset()` after each test, e.g. for [Jasmine][1] or
[Mocha][2]:

``` js
afterEach(() => {
viewport.reset()
})
```

[1]: https://jasmine.github.io
[2]: https://mochajs.org/

### Advanced configuration
### Configuration

#### `config.viewport.context`

By default, `viewport` will target the default `iframe#context` of Karma,
which is enabled through `client.useIframe` (see the [configuration guide][3]).
which is enabled through `client.useIframe` (see the [configuration guide][1]).
This will also wrap the `debug` context to run inside the `iframe#context`.

To run tests within a custom, separate context, e.g. `iframe#viewport`:
Expand All @@ -88,16 +74,15 @@ module.exports = function(config) {
```

Note that the `iframe#viewport` element must be present in the `context.html`
and `debug.html` files that are served by Karma. Using a separate, custom
context makes it possible to load entire webpages for testing:
and `debug.html` files that are served by Karma. You can override the files, or
add an `iframe` element dynamically before running the tests. Using a separate,
custom context makes it possible to load entire webpages for testing:

``` js
beforeEach(done => {
viewport.load("/path/to/fixture.html", done)
})
viewport.load("/path/to/fixture.html").then(() => { /* webpage was loaded */ })
```

[3]: http://karma-runner.github.io/1.0/config/configuration-file.html
[1]: http://karma-runner.github.io/1.0/config/configuration-file.html

#### `config.viewport.breakpoints`

Expand Down Expand Up @@ -176,7 +161,19 @@ viewport.between("tablet", "screen", name => {
})
```

After breakpoint iteration, `viewport.reset()` is called internally.
After breakpoint iteration, `viewport.reset()` is called internally. If the
callback provided to the breakpoint returns a `Promise`, the return value of
the function will also be a `Promise`. This enables asynchronous tests.

### TypeScript

`karma-viewport` is written in TypeScript and comes with its own typings. Don't
include the package using an `import` statement, but instead include its types
via `tsconfig.json` or a reference within `karma.conf.ts` or tests:

``` ts
/// <reference types="karma-viewport" />
```

## License

Expand Down
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "karma-viewport",
"version": "1.0.1",
"description": "A Karma plugin for testing responsive layouts",
"version": "1.0.2",
"description": "A Karma plugin for testing responsive features and layout",
"keywords": [
"breakpoint",
"iframe",
Expand Down

0 comments on commit 6219c4c

Please sign in to comment.