Skip to content

Commit

Permalink
using ES modules and testing in browser WIP
Browse files Browse the repository at this point in the history
  • Loading branch information
mandric authored and Milan Andric committed Mar 11, 2019
2 parents f8cd0b1 + d3f9011 commit 4e5a990
Show file tree
Hide file tree
Showing 20 changed files with 30,471 additions and 8,083 deletions.
40 changes: 23 additions & 17 deletions Readme.md
Original file line number Diff line number Diff line change
@@ -1,36 +1,42 @@
[![CircleCI](https://circleci.com/gh/mandric/extension-testing-example.svg?style=svg)](https://circleci.com/gh/mandric/extension-testing-example)

# extension-testing-example

Browser extension example using Parcel, Mocha, Sinon-Chrome and Chrome API.
Browser extension example using ES Modules and browser testing with Mocha, Chai
and Sinon. Specifically testing in the browser to exercise the browser APIs
available to extensions.

Test browser APIs directly where possible and mock with Sinon otherwise.
Sinon-chrome is available to mock chrome but ideally it would mock Firefox too.
webextension-polyfill is used to standardize the `browser` API but have not
tried mocking that yet.

Hoping to make it work with Firefox then Safari next.
Aiming for this to work in at least Chrome, Firefox and Safari.

# Build
# Builds

```
git clone [this repo]
cd extension-testing-example
npm install
npm run build # runs parcel build src/manifest.json
npm run build # runs parcel atm, will probably move to webpack
```

Then you should be able to load the `dist/` directory into your Chrome browser
as an extension and see Fibonacci greatness.
Then you should be able to load the `dist/` directory into your browser as an
extension and see Fibonacci greatness.

If you need unminified builds you can pass a flag to Parcel.
There is currently only one build but in the future only the debug build would
include the tests so anyone can rum them after installation.

```
npx parcel build --no-minify --no-source-maps src/manifest.json
```
# Tests

# Unit Tests
Click the tests button in the extension popup to run the tests in separate html
page.

```
npm test # runs mocha
```
You can also load the test runner using a web server rather than extension
protocol with `npm run server` and `http://127.0.0.1:8080/test.html`.

# Integration Tests
## Integration

Planning to use Puppeteer here (Chrome only) to start out with.
Integration tests or e2e yet to be introduced, plan is to use webdriverio.

[![CircleCI](https://circleci.com/gh/mandric/extension-testing-example.svg?style=svg)](https://circleci.com/gh/mandric/extension-testing-example)
Loading

0 comments on commit 4e5a990

Please sign in to comment.