htmlcmp

Tool to compare (generated) HTML files visually and automatically using Selenium.

Provides various entry points to run:

• compare-html is a CLI tool to compare two directory structures containing HTML files
• compare-html-server starts a webserver and allows to inspect differences manually
• html-render-diff renders two HTML files and produces images
• html-tidy allows to run HTML tidy on a directory

Used for regression testing in https://github.com/opendocument-app/OpenDocument.core.

Reviewing differences in the browser

compare-html-server serves two pages:

• the overview lists every comparable file with its status (same, different, pending), a search box, status filters with counts, and an update ref button per file plus Update all in view
• the compare page (click a path) shows reference (A) and monitored (B) side by side with synchronised scrolling, a diff strip in between, and the controls to work through a review

On the compare page:

• Update reference copies the monitored file over the reference one; the file is then marked ✓ accepted for the rest of the session (the mark disappears again if the monitored file changes afterwards)
• ← / → step to the previous and next document; tick diffs only to skip files that already match
• the diff strip maps the whole page into the column: red bars mark the regions that differ, the blue box marks the visible part of the document, and a click jumps both panes to that position

Comparison results are computed live, so the pages update themselves while the monitored directory is being regenerated. Accepted marks are kept in memory only and are gone after a restart.

Install via PyPI

pip install htmlcmp

Download and run the docker image

docker pull ghcr.io/opendocument-app/odr_core_test

docker run -ti \
  -v $(pwd):/repo \
  -p 8000:8000 \
  ghcr.io/opendocument-app/odr_core_test \
  compare-html-server /repo/REFERENCE /repo/MONITORED --compare --driver firefox --port 8000

Manually build the docker image

docker build --tag odr_core_test test/docker

Run locally

PYTHONPATH=$(pwd)/src:$PYTHONPATH python ./src/htmlcmp/compare_output_server.py \
  /path/to/REFERENCE \
  /path/to/MONITORED \
  --compare \
  --driver firefox \
  --port 8000 \
  -vv