Testing plots with playwright e2e

test_plots_html_e2e.py

"""
Setup:
1. pip install pytest-playwright
2. playwright install
3. `pytest test_plots_html_e2e.py` to run in headless mode. Add `--headed` for non-headless mode.
"""

import dataclasses
import os
from typing import List

from playwright.sync_api import Page, ConsoleMessage

from dvc.render.utils import render
 

@dataclasses.dataclass
class ErrorLogs:
    errors: List[str] = dataclasses.field(default_factory=list)

    def append_error_logs(self, message: ConsoleMessage) -> None:
        if message.type == "error":
            self.errors.append(message.text)


def test_example_is_working(tmp_dir, dvc, page: Page):
    data = {
        "HEAD": {
            "data": {
                "file.json": {
                    "data": [{"y": 5}, {"y": 6}],
                    "props": {"fields": {"y"}},
                },
            }
        },
        "v2": {
            "data": {
                "file.json": {
                    "data": [{"y": 3}, {"y": 5}],
                    "props": {"fields": {"y"}},
                },
            }
        },
    }
    render(dvc, data, path=os.curdir)
    html_file = tmp_dir / "index.html"
    assert html_file.is_file()

    error_logs = ErrorLogs()
    page.on("console", error_logs.append_error_logs)
    page.goto(html_file.as_uri(), wait_until="load")
    page.wait_for_load_state("networkidle")
    page.is_visible("div#plot_file_json > div.chart-wrapper > canvas")
    assert not error_logs.errors