Close rialto-php#10: Send Browser logs to the PHP logger

CHANGELOG.md

@@ -8,7 +8,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 **Note:** PuPHPeteer is heavily based on [Rialto](https://github.com/nesk/rialto). For a complete overview of the changes, you might want to check out [Rialto's changelog](https://github.com/nesk/rialto/blob/master/CHANGELOG.md) too.
 
 ## [Unreleased]
-_In progress…_
+### Added
+- Add a `log_browser_console` option to log the output of Browser's console methods (`console.log`, `console.debug`, `console.table`, etc…) to the PHP logger
 
 ## [1.2.0] - 2018-07-25
 ### Added

README.md

@@ -82,9 +82,19 @@ $puppeteer = new Puppeteer;
 
 This will create a new Node process controlled by PHP.
 
-You can also pass some options to the constructor, see [Rialto's documentation](https://github.com/nesk/rialto/blob/master/docs/api.md#options).
+You can also pass some options to the constructor, see [Rialto's documentation](https://github.com/nesk/rialto/blob/master/docs/api.md#options). PuPHPeteer also extends these options:
 
-**Note:** If you use some timeouts higher than 30 seconds in Puppeteer's API, you will have to set a higher value for the `read_timeout` option (default: `35`):
+```php
+[
+    // Logs the output of Browser's console methods (console.log, console.debug, etc...) to the PHP logger
+    'log_browser_console' => false,
+]
+```
+
+<details>
+<summary><strong>⏱ Want to use some timeouts higher than 30 seconds in Puppeteer's API?</strong></summary> <br>
+
+If you use some timeouts higher than 30 seconds, you will have to set a higher value for the `read_timeout` option (default: `35`):
 
 ```php
 $puppeteer = new Puppeteer([
@@ -95,6 +105,7 @@ $puppeteer->launch()->newPage()->goto($url, [
     'timeout' => 60000, // In milliseconds
 ]);
 ```
+</details>
 
 ### No need to use the `await` keyword
 

composer.json

@@ -21,10 +21,12 @@
     "require": {
         "php": ">=7.1",
         "nesk/rialto": "^1.2.0",
+        "psr/log": "^1.0",
         "vierbergenlars/php-semver": "^3.0.2"
     },
     "require-dev": {
         "codedungeon/phpunit-result-printer": ">=0.6 <1.0",
+        "monolog/monolog": "^1.23",
         "phpunit/phpunit": "^6.5|^7.0",
         "symfony/process": "^4.0"
     },

src/Puppeteer.php

@@ -9,6 +9,18 @@
 
 class Puppeteer extends AbstractEntryPoint
 {
+    /**
+     * Default options.
+     *
+     * @var array
+     */
+    protected $options = [
+        'read_timeout' => 30,
+
+        // Logs the output of Browser's console methods (console.log, console.debug, etc...) to the PHP logger
+        'log_browser_console' => false,
+    ];
+
     /**
      * Instanciate Puppeteer's entry point.
      */
@@ -21,7 +33,7 @@ public function __construct(array $userOptions = [])
         parent::__construct(
             __DIR__.'/PuppeteerConnectionDelegate.js',
             new PuppeteerProcessDelegate,
-            ['read_timeout' => 35],
+            $this->options,
             $userOptions
         );
     }

src/PuppeteerConnectionDelegate.js

@@ -1,18 +1,25 @@
 'use strict';
 
 const puppeteer = require('puppeteer'),
+    Page = require('puppeteer/lib/Page'),
     {Browser} = require('puppeteer/lib/Browser'),
-    {ConnectionDelegate} = require('@nesk/rialto');
+    {ConnectionDelegate} = require('@nesk/rialto'),
+    Logger = require('@nesk/rialto/src/node-process/Logger'),
+    ConsoleInterceptor = require('@nesk/rialto/src/node-process/NodeInterceptors/ConsoleInterceptor'),
+    StandardStreamsInterceptor = require('@nesk/rialto/src/node-process/NodeInterceptors/StandardStreamsInterceptor');
 
 /**
  * Handle the requests of a connection to control Puppeteer.
  */
-class PuppeteerConnectionDelegate extends ConnectionDelegate {
+class PuppeteerConnectionDelegate extends ConnectionDelegate
+{
     /**
      * Constructor.
+     *
+     * @param  {Object} options
      */
-    constructor() {
-        super();
+    constructor(options) {
+        super(options);
 
         this.browsers = new Set;
 
@@ -23,8 +30,6 @@ class PuppeteerConnectionDelegate extends ConnectionDelegate {
      * @inheritdoc
      */
     async handleInstruction(instruction, responseHandler, errorHandler) {
-        const instructionName = instruction.name();
-
         instruction.setDefaultResource(puppeteer);
 
         let value = null;
@@ -43,9 +48,37 @@ class PuppeteerConnectionDelegate extends ConnectionDelegate {
             this.browsers.add(value);
         }
 
+        if (this.options.log_browser_console === true && value instanceof Page) {
+            value.on('console', this.logConsoleMessage);
+        }
+
         responseHandler(value);
     }
 
+    /**
+     * Log the console message.
+     *
+     * @param {ConsoleMessage} consoleMessage
+     */
+    async logConsoleMessage(consoleMessage) {
+        const type = consoleMessage.type();
+
+        if (!ConsoleInterceptor.typeIsSupported(type)) {
+            return;
+        }
+
+        const level = ConsoleInterceptor.getLevelFromType(type);
+        const args = await Promise.all(consoleMessage.args().map(arg => arg.jsonValue()));
+
+        StandardStreamsInterceptor.startInterceptingStrings(message => {
+            Logger.log('Browser', level, ConsoleInterceptor.formatMessage(message));
+        });
+
+        ConsoleInterceptor.originalConsole[type](...args);
+
+        StandardStreamsInterceptor.stopInterceptingStrings();
+    }
+
     /**
      * Listen for process signal events.
      *

tests/PuphpeteerTest.php

@@ -173,4 +173,30 @@ public function check_all_resources_are_supported()
 
         $this->markTestIncomplete($incompleteText);
     }
+
+    /**
+     * @test
+     * @dontPopulateProperties browser
+     */
+    public function browser_console_calls_are_logged()
+    {
+        $setups = [
+            [false, 'Received data from the port'],
+            [true, 'Received a Browser log:'],
+        ];
+
+        foreach ($setups as [$logBrowserConsole, $startsWith]) {
+            $puppeteer = new Puppeteer([
+                'log_browser_console' => $logBrowserConsole,
+                'logger' => $this->loggerMock(
+                    $this->at(9),
+                    $this->isLogLevel(),
+                    $this->stringStartsWith($startsWith)
+                ),
+            ]);
+
+            $this->browser = $puppeteer->launch($this->browserOptions);
+            $this->browser->newPage()->goto($this->url);
+        }
+    }
 }

tests/TestCase.php

@@ -2,7 +2,12 @@
 
 namespace Nesk\Puphpeteer\Tests;
 
+use Monolog\Logger;
+use ReflectionClass;
+use Psr\Log\LogLevel;
+use PHPUnit\Framework\Constraint\Callback;
 use PHPUnit\Framework\TestCase as BaseTestCase;
+use PHPUnit\Framework\MockObject\Matcher\Invocation;
 
 class TestCase extends BaseTestCase
 {
@@ -24,4 +29,42 @@ public function canPopulateProperty(string $propertyName): bool
     {
         return !in_array($propertyName, $this->dontPopulateProperties);
     }
+
+    public function loggerMock($expectations) {
+        $loggerMock = $this->getMockBuilder(Logger::class)
+            ->setConstructorArgs(['rialto'])
+            ->setMethods(['log'])
+            ->getMock();
+
+        if ($expectations instanceof Invocation) {
+            $expectations = [func_get_args()];
+        }
+
+        foreach ($expectations as $expectation) {
+            [$matcher] = $expectation;
+            $with = array_slice($expectation, 1);
+
+            $loggerMock->expects($matcher)
+                ->method('log')
+                ->with(...$with);
+        }
+
+        return $loggerMock;
+    }
+
+    public function isLogLevel(): Callback {
+        $psrLogLevels = (new ReflectionClass(LogLevel::class))->getConstants();
+        $monologLevels = (new ReflectionClass(Logger::class))->getConstants();
+        $monologLevels = array_intersect_key($monologLevels, $psrLogLevels);
+
+        return $this->callback(function ($level) use ($psrLogLevels, $monologLevels) {
+            if (is_string($level)) {
+                return in_array($level, $psrLogLevels, true);
+            } else if (is_int($level)) {
+                return in_array($level, $monologLevels, true);
+            }
+
+            return false;
+        });
+    }
 }

tests/resources/index.html

@@ -10,7 +10,9 @@
         <h1>Example Page</h1>
 
         <script>
+            console.log('Starting worker...');
             new Worker('worker.js');
+            console.log('Worker started!');
         </script>
     </body>
 </html>