Debugging JavaScript tests

Question

Recently started working on some JavaScript tests by extending JavascriptTestBase in drupal 8.2 and the biggest problem currently is debugging.

Phantomjs is installed and i have no problem running JavaScript tests. Xdebug is installed too.

$this->getSession()->getScreenshot();

is not returning any output, maybe some additional configuration is needed?

file_put_contents('/Users/me/debug.html', $this->getSession()->getDriver()->getHtml('/html/body'))

is giving me a half broken page.

I would really appreciate if someone can share how they debug these tests and how they set it up, some useful links. The biggest help would be to be able to take screenshots but any info on this topic is welcome.

Answer 1

I think that you are looking for JavascriptTestBase::createScreenshot() https://api.drupal.org/api/drupal/core!tests!Drupal!FunctionalJavascriptTests!JavascriptTestBase.php/function/JavascriptTestBase%3A%3AcreateScreenshot/8.2.x

See the following snippet from a core test:

  /**
   * Tests creating screenshots.
   */
  public function testCreateScreenshot() {
    $this->drupalGet('<front>');
    $this->createScreenshot('public://screenshot.jpg');
    $this->assertFileExists('public://screenshot.jpg');
  }