JuliaPluto/Pluto.jl

Test the /sample/test1.jl interactive notebook with Puppeteer

Open

#867 opened on Jan 21, 2021

View on GitHub
 (0 comments) (0 reactions) (0 assignees)Julia (5,295 stars) (329 forks)batch import
frontendgood first issuetests

Description

Introduction

This is a newcomer-friendly issue. Most of Pluto's functionality is documented in this notebook that exists as part of the codebase. We use it whenever we change something to our frontend code, to check that things are still working.

Right now we run this notebook manually, and perform the checks by hand. This issue is about running and testing the reactivity and the features of pluto automatically with the Puppeteer framework.

Puppeteer is a Chromium browser with an API, that we already use to run some simple tests.

What needs to be done

  1. create a new branch
  2. create a new .js file in /test/frontend/__tests__
  3. add code that will perform actions that a user would do. In puppeteer we usually do that waiting for selectors to show up in the DOM and then executing some browser code.
  4. make sure that the action had the correct result and nothing exploded

You can take a look at the existing tests, though this one is more advanced. Eventually, we would like all tests from this notebook to run automatically, but small steps are also welcome!

If you're interested in doing that and have more questions, feel free to ask here or in zulip

Contributor guide

Tech stack
javascriptnodejs
Domain
testingfrontend
Issue type
test
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
half day
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
clear
Prerequisites
JavaScriptPuppeteerNode.jsGit
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
85
Research direction
Begin by examining the existing frontend tests in /test/frontend/ tests (e.g., autocomplete test.js) to understand the testing setup. Create a new .js file in that directory. Use Puppeteer to load the sample/test1.jl notebook and simulate simple user interactions like clicking cells or evaluating code. Verify that the notebook updates as expected. Start with a single interaction and expand gradually.