Skip to content
This repository has been archived by the owner on Jun 17, 2021. It is now read-only.

Change test script to interactive mode #328

Open
14 tasks
AWolf81 opened this issue Nov 10, 2018 · 2 comments
Open
14 tasks

Change test script to interactive mode #328

AWolf81 opened this issue Nov 10, 2018 · 2 comments

Comments

@AWolf81
Copy link
Collaborator

AWolf81 commented Nov 10, 2018

At the moment, tests inside Guppy are running once and the user need to re-run manually. As @joshwcomeau mentioned in a comment that's a temporary hack.

It was a good idea from Josh to do this later as this is a pretty large task. But maybe two people could work on this.
One for implementing the UI with jest-stare and the other for parsing/handling the interactive commands. But it's also possible to tackle this with-out splitting - just do it like this: First UI then command handling or start with a minimal temporary UI and work on the business logic first then improve UI.

Is your feature request related to a problem? Please describe.
UX could be better if it would be possible to use interactive mode.

Describe the solution you'd like
By removing line 188 to 190 in task.saga. We're running in interactive mode and the output in a terminal will look like in the following screenshot (ran in a real terminal as the Guppy output seems to be filtered):
grafik

Todos
UI

  • Remove terminal from test preview as we're rendering everything to the UI
  • The status should change if the interactive test is passing to green & on fail to red.
  • Extract every info from the terminal output from top down to string Watch usage. Maybe we could also change to a json reporter so it's easier to get the output - not sure if this is working with interactive mode.
  • Render the test result - I think we could use jest-stare to render it.
  • Show progress bar & expected test time (optional, less important)
  • Create a UI element for each command:
    • Run all tests a key
    • Run only failed tests f key
    • Filtering p & t key with a input field
    • Stop tests q key
    • Re-run test enter key
  • Use the same keys as keyboard shortcuts so it's possible to trigger them with keyboard.

Command handling

  • Create a runTest generator in task.saga that's listening for a Redux action that will pass the command to the test child process. So you have to use take(stdioChannel) and takeEvery(TRIGGER_TEST_COMMAND, handleTestCommand) inside a while(true) loop.
  • handleTestCommand will use sendCommandToProcess to send the command passed with the action TRIGGER_TEST_COMMAND to the test child process.

Edge cases

  • What happens if a snapshot needs to be updated? Parse the info from the output and display a button & also show a list of snapshot files that are not matching so they can be opened in editor. Jest-stare is already doing a nice diff display - maybe we could display this if we're detecting that a snapshot failed.
@superhawk610
Copy link
Collaborator

https://github.com/Raathigesh/majestic looks like a cool Jest front-end that fits better with Guppy's UI out of the box, perhaps another option to consider.

@AWolf81
Copy link
Collaborator Author

AWolf81 commented Apr 7, 2019

Good idea. Maybe we could use it as starting point, inspiration for the UI or directly integrate it. I like the navigation through the test files but I have some points I don't like:

  • No progressbar during test run - just indefinite spinners at each test suite (jest console output got a time & progress bar indication)
  • Takes pretty long to load (not measured but I think around 5-10 sec. for Guppy tests)

Guppy tests in Majestic
grafik

How would we add the testing pane? I think it would be good if we could have a second project page so we're getting more space for the UI. I don't like to add this into the modal or would this fit into the modal?

If we would use Majestic would we create a fork (so we can customize the UI & add features) and launch it with npx https://github.com/forked-majestic? Or should we add it as submodule and run it with-out npx (probably a better dev. experience)? Once the server is started, we could show the Majestic server output in an iframe.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants