Skip to main content
Join the official 2019 Python Developers SurveyStart the survey!

Dash snapshot testing package

Project description


# dash-snapshot-testing
Use snapshot testing, inspired by Jest snapshot testing, to test [Dash][] components.

See the project [README](https://github.com/StratoDem/dash-snapshot-testing/blob/master/README.md) for more detailed information.

## Inspiration
Testing a long HTML component output for a Dash application is difficult.
It typically requires hardcoding data or setting up a dummy database.
Using snapshot tests that JSON serialize the Dash component output provide another
easy testing layer to ensure that code refactors/changes do not change the
output unexpectedly.

To learn more about snapshot testing in general, see a much more elaborate explanation from the [Facebook Jest site](https://facebook.github.io/jest/docs/en/snapshot-testing.html)

## Installation and usage
```bash
$ pip install dash-snapshot-testing
```

```python
import dash_html_components as html

from dash_snapshot_testing.snapshot_test import DashSnapshotTestCase


class MyUnitTestCase(DashSnapshotTestCase):
def test_component(self):
my_component = html.Div([html.P('wow'), html.Span('this works')], id='test-id')

self.assertSnapshotEqual(my_component, 'my-test-unique-id')
```

This outputs/checks this JSON at `__snapshots__/MyUnitTestCase-my-test-unique-id.json`:
```json
{
"type": "Div",
"props": {
"id": "test-id",
"children": [
{
"type": "P",
"props": {"children": "wow"},
"namespace": "dash_html_components"
},
{
"type": "Span",
"props": {"children": "this works"},
"namespace": "dash_html_components"
}
]
},
"namespace": "dash_html_components"
}
```

### Setting a custom `snapshots_dir` for the class
```python
class MyOtherUnitTestCase(DashSnapshotTestCase):
snapshots_dir = '__snapshots_2__'

def test_component(self):
my_component = html.Div([html.P('wow'), html.Span('another one')], id='test-id')

self.assertSnapshotEqual(my_component, 'my-test-unique-id')
```

This outputs/checks this JSON at `__snapshots_2__/MyOtherUnitTestCase-my-test-unique-id.json`:
```json
{
"type": "Div",
"props": {
"id": "test-id",
"children": [
{
"type": "P",
"props": {"children": "wow"},
"namespace": "dash_html_components"
},
{
"type": "Span",
"props": {"children": "another one"},
"namespace": "dash_html_components"
}
]
},
"namespace": "dash_html_components"
}
```

### Overwriting snapshots
To overwrite pre-existing snapshots, [like in Jest](https://facebook.github.io/jest/docs/en/snapshot-testing.html#updating-snapshots), set an environment variable as `UPDATE_DASH_SNAPSHOTS=TRUE`:
```bash
# This will run and make new snapshots
> UPDATE_DASH_SNAPSHOTS=TRUE python -m unittest my_test_module
# This will run against the previous snapshots
> python -m unittest my_test_module
```

### How this works
At its core, this `unittest.TestCase` compares a JSON-serialized Dash component
against a previously stored JSON-serialized Dash component, and checks if the `dict`
objects from `json.loads` are equivalent using `assertEqual`.

[Dash]: https://github.com/plotly/dash


Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Files for dash-snapshot-testing, version 1.2.2
Filename, size File type Python version Upload date Hashes
Filename, size dash_snapshot_testing-1.2.2-py2.py3-none-any.whl (6.7 kB) File type Wheel Python version py2.py3 Upload date Hashes View hashes
Filename, size dash_snapshot_testing-1.2.2-py3-none-any.whl (6.7 kB) File type Wheel Python version py3 Upload date Hashes View hashes
Filename, size dash-snapshot-testing-1.2.2.tar.gz (4.2 kB) File type Source Python version None Upload date Hashes View hashes

Supported by

Elastic Elastic Search Pingdom Pingdom Monitoring Google Google BigQuery Sentry Sentry Error logging AWS AWS Cloud computing DataDog DataDog Monitoring Fastly Fastly CDN SignalFx SignalFx Supporter DigiCert DigiCert EV certificate StatusPage StatusPage Status page