Add tests and github workflow (#20)

Add tests:
- generate documentation
- pure python test using pytest
- notebook test using yarn and playwright, check the official document from ipywidgets

.github/workflows/ci.yml

@@ -0,0 +1,119 @@
+name: Test
+
+on: [push, pull_request]
+
+jobs:
+  docs:
+    name: Documentation
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - name: Set up Python
+        uses: actions/setup-python@v4
+        with:
+          python-version: 3.11
+          cache: 'pip'
+          cache-dependency-path: |
+            **/requirements*.txt
+      - name: Install dependencies
+        run: |
+          sudo apt-get install -y pandoc
+          python -m pip install --upgrade pip
+          python -m pip install -e .
+          python -m pip install -r ./docs/requirements.txt
+      - name: Build docs
+        run: |
+          cd docs/source
+          python -m sphinx -T -E -b html -d ../build/doctrees -D language=en . ../build/html
+
+  python:
+    name: Python
+    runs-on: ubuntu-latest
+    strategy:
+      max-parallel: 4
+      matrix:
+        python-version: ['3.8', '3.9', '3.10', '3.11']
+
+    steps:
+      - uses: actions/checkout@v3
+      - name: Set up Python ${{ matrix.python-version }}
+        uses: actions/setup-python@v4
+        with:
+          python-version: ${{ matrix.python-version }}
+          cache: 'pip'
+          cache-dependency-path: |
+            **/setup.cfg
+            **/requirements*.txt
+
+      - name: Install dependencies
+        run: |
+          python -m pip install --upgrade pip
+          pip install -e .
+          pip install "pytest<8"
+      - name: Test with pytest
+        run: |
+          cd tests
+          pytest
+
+
+  ui-test:
+    name: Visual Regression
+    runs-on: ubuntu-latest
+
+    steps:
+      - uses: actions/checkout@v3
+      - name: Set up Python
+        uses: actions/setup-python@v4
+        with:
+          python-version: '3.11'
+          cache: 'pip'
+          cache-dependency-path: |
+            **/setup.cfg
+            **/requirements*.txt
+
+      - name: Install dependencies
+        run: |
+          python -m pip install --upgrade pip
+          python -m pip install -U jupyterlab==4.1.2 jupyter-packaging~=0.12
+          pip install -e .
+
+      - name: Install Test Dependencies
+        run: |
+          jlpm --immutable
+          npx playwright install chromium
+        working-directory: tests/notebooks
+
+      - name: Execute integration tests
+        shell: bash -l {0}
+        working-directory: tests/notebooks
+        run: |
+          npx playwright test
+
+      - name: Upload Playwright Test assets
+        if: always()
+        uses: actions/upload-artifact@v3
+        with:
+          name: test-assets
+          path: |
+            tests/notebooks/test-results
+
+      - name: Upload Playwright Test report
+        if: always()
+        uses: actions/upload-artifact@v3
+        with:
+          name: test-report
+          path: |
+            tests/notebooks/playwright-report
+
+      - name: Update snapshots
+        if: failure()
+        working-directory: tests/notebooks
+        run: |
+          jlpm test:update
+
+      - name: Upload updated snapshots
+        if: failure()
+        uses: actions/upload-artifact@v3
+        with:
+          name: updated-snapshots
+          path: tests/notebooks/tests

.gitignore

@@ -128,9 +128,37 @@ dmypy.json
 # Pyre type checker
 .pyre/
 
+# javascript
+docs/man/*.gz
+docs/source/api/generated
+docs/source/.cache
+*.doit.db
+_contents
+node_modules
+*.py[co]
+__pycache__
+*.egg-info
+*~
+*.bak
+.ipynb_checkpoints
+.tox
+.DS_Store
+\#*#
+.#*
+.coverage
+.xunit.xml
+.tern-project
+npm-debug.log
+.pytest_cache
+.vscode/*
+!.vscode/extensions.json
+
 #
 *.pdf
 tests/work
-/tests/**/*.png
 *.xyz
 test.ipynb
+
+tests/notebooks/test-results
+tests/notebooks/playwright-report
+tests/notebooks/.yarn/cache

README.md

@@ -2,7 +2,7 @@
 # Welcome to WEAS Widget!
 [![PyPI version](https://badge.fury.io/py/weas-widget.svg)](https://badge.fury.io/py/weas-widget)
 [![Docs status](https://readthedocs.org/projects/weas-widget/badge)](http://weas-widget.readthedocs.io/)
-
+[![Unit test](https://github.com/superstar54/weas-widget/actions/workflows/ci.yml/badge.svg)](https://github.com/superstar54/weas-widget/actions/workflows/ci.yml)
 
 A widget to visualize and edit atomistic structures in Jupyter Notebook. It uses [WEAS](https://github.com/superstar54/weas) (Web Environment For Atomistic Structure) in the backend.
 
@@ -36,6 +36,21 @@ To install the latest version from source, first clone the repository and then i
     $ pip install -e weas-widget
 ```
 
+## How to use
+
+Please visit: https://weas-widget.readthedocs.io/en/latest/index.html
+
+
+## Issue
+If you encounter any problems, please update the widget to the latest version.
+
+```console
+    pip install weas-widget  --upgrade
+```
+
+If the problem persists, please report it on the [GitHub issue](https://github.com/superstar54/weas-widget/issues)
+
+
 
 ## Edit the structure with mouse and keyboard
 WEAS supports editing the atoms directly in the GUI and synchronizing with the structure of the Python object.
@@ -148,7 +163,7 @@ trajectory = generate_phonon_trajectory(atoms, eigenvector, repeat=[4, 4, 1])
 viewer = WeasWidget()
 viewer.from_ase(trajectory)
 # set a vector field to show the arrow
-viewer.vectorField = {"origins": "positions", "vectors": "movement", "radius": 0.1}
+viewer.vectorField = [{"origins": "positions", "vectors": "movement", "radius": 0.1}]
 viewer
 ```
 
@@ -162,11 +177,6 @@ viewer
 viewer.download_image("filename.png")
 ```
 
-## How to use
-
-Please visit: https://weas-widget.readthedocs.io/en/latest/index.html
-
-
 
 ## Contact
 * Xing Wang  <[email protected]>

docs/source/index.rst

@@ -28,6 +28,7 @@ A widget to visualize and interact with atomistic structures in Jupyter Notebook
    measurement
    isosurface
    vector_field
+   selection
 
 
 Indices and tables

docs/source/quick_start.ipynb

@@ -362,7 +362,7 @@
     "origins = atoms.positions\n",
     "# the vertor\n",
     "vectors = [[0, 0, 1]]*len(atoms)\n",
-    "viewer.vectorField = {\"origins\": origins, \"vectors\": vectors, \"color\": \"red\"}"
+    "viewer.vectorField = [{\"origins\": origins, \"vectors\": vectors, \"color\": \"red\"}]"
    ]
   },
   {

docs/source/vector_field.rst

@@ -43,7 +43,7 @@ One can visualize the phonon dispersion via lattice vibrations. One only need to
     viewer = WeasWidget()
     viewer.from_ase(trajectory)
     # set a vector field to show the arrow
-    viewer.vectorField = {"origins": "positions", "vectors": "movement", "radius": 0.1}
+    viewer.vectorField = [{"origins": "positions", "vectors": "movement", "radius": 0.1}]
     viewer