karma-viewport
Advanced tools
Comparing version 1.0.1 to 1.0.2
@@ -1,2 +0,1 @@ | ||
import "array-findindex-polyfill"; | ||
/** | ||
@@ -24,10 +23,2 @@ * Viewport breakpoint | ||
/** | ||
* Extend window element with missing types | ||
*/ | ||
declare global { | ||
interface Window { | ||
HTMLIFrameElement: typeof HTMLIFrameElement; | ||
} | ||
} | ||
/** | ||
* Resolve relevant breakpoint range | ||
@@ -98,5 +89,7 @@ * | ||
* | ||
* @param {string} first - First breakpoint name | ||
* @param {string} last - Last breakpoint name | ||
* @param {Function} cb - Callback to execute after resizing | ||
* @param first - First breakpoint name | ||
* @param last - Last breakpoint name | ||
* @param cb - Callback to execute after resizing | ||
* | ||
* @return Promise resolving with no result | ||
*/ | ||
@@ -103,0 +96,0 @@ between<T extends Promise<any>>(first: string, last: string, cb: ViewportCallback<T>): Promise<void>; |
@@ -43,3 +43,3 @@ "use strict"; | ||
throw new TypeError("Invalid viewport configuration: " + viewport); | ||
return function (content, file, done) { | ||
return function (content, _file, done) { | ||
var config = Object.assign(JSON.parse(content), viewport); | ||
@@ -46,0 +46,0 @@ var result = jsonschema_1.validate(config, schema); |
{ | ||
"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": [ | ||
@@ -6,0 +6,0 @@ "breakpoint", |
@@ -13,7 +13,7 @@ [![Travis][travis-image]][travis-link] | ||
[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 | ||
@@ -28,4 +28,2 @@ ## Installation | ||
### Basic configuration | ||
Add `viewport` to the list of frameworks inside your Karma configuration: | ||
@@ -42,4 +40,4 @@ | ||
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.: | ||
@@ -57,20 +55,8 @@ ``` js | ||
Remember to call `viewport.reset()` after each test, e.g. for [Jasmine][1] or | ||
[Mocha][2]: | ||
### Configuration | ||
``` js | ||
afterEach(() => { | ||
viewport.reset() | ||
}) | ||
``` | ||
[1]: https://jasmine.github.io | ||
[2]: https://mochajs.org/ | ||
### Advanced 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`. | ||
@@ -95,12 +81,11 @@ | ||
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 | ||
@@ -184,4 +169,16 @@ #### `config.viewport.breakpoints` | ||
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 | ||
@@ -188,0 +185,0 @@ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
166929
352
201