add support for projects to suppress console output (#29960)

* add support for projects to suppress console output

* update E2E env readme, package lock maintenance

tests/e2e/config/jest.setup.js

@@ -7,6 +7,10 @@ import {
 
 const config = require('config');
 const { HTTPClientFactory } = require('@woocommerce/api');
+const { addConsoleSuppression } = require( '@woocommerce/e2e-environment' );
+
+// @todo: remove this once https://github.com/woocommerce/woocommerce-admin/issues/6992 has been addressed
+addConsoleSuppression( 'woocommerce_shared_settings' );
 
 /**
  * Uses the WordPress API to delete all existing posts

tests/e2e/env/README.md

@@ -133,6 +133,24 @@ module.exports = puppeteerConfig;
 
 Jest provides [setup and teardown functions](https://jestjs.io/docs/setup-teardown) similar to PHPUnit. The default setup and teardown is in [`tests/e2e/env/src/setup/jest.setup.js`](src/setup/jest.setup.js). Additional setup and teardown functions can be added to [`tests/e2e/config/jest.setup.js`](../config/jest.setup.js)
 
+#### Console filtering
+
+**Added version 0.2.3**
+By default, messages logged to the console are included in the test results. The test runner suppresses 404 not found and proxy connection messages. 
+
+Pages that you are testing may contain repetitive console output that you expect. Use `addConsoleSuppression` in your jest setup script to filter these repetitive messages:
+
+```js
+addConsoleSuppression( 'suppress this after the first instance' );
+addConsoleSuppression( 'suppress this completely', false );
+```
+
+Console suppressions can be removed with `removeConsoleSuppression`. The `searchString` parameter needs to match the `addConsoleSuppression` parameter:
+
+```js
+removeConsoleSuppression( 'suppress this after the first instance' );
+```
+
 ### Container Setup
 
 Depending on the project and testing scenario, the built in testing environment container might not be the best solution for testing. This could be local testing where there is already a testing container, a repository that isn't a plugin or theme and there are multiple folders mapped into the container, or similar. The `e2e-environment` test runner supports using either the built in container or an external container. See the appropriate readme for  details:

tests/e2e/env/package-lock.json

@@ -1,6 +1,6 @@
 {
 	"name": "@woocommerce/e2e-environment",
-	"version": "0.2.1",
+	"version": "0.2.2",
 	"lockfileVersion": 1,
 	"requires": true,
 	"dependencies": {

tests/e2e/env/src/setup/jest.setup.js

@@ -7,10 +7,8 @@ import {
 	enablePageDialogAccept,
 	isOfflineMode,
 	setBrowserViewport,
-	switchUserToAdmin,
-	switchUserToTest,
-	visitAdminPage,
 } from '@wordpress/e2e-test-utils';
+import { consoleShouldSuppress, addConsoleSuppression } from '../../utils';
 
 /**
  * Array of page event tuples of [ eventName, handler ].
@@ -18,21 +16,13 @@ import {
  * @type {Array}
  */
 const pageEvents = [];
+
 /**
  * Set of logged messages that will only be logged once.
- *
- * @type {Object<string,object>}
  */
-const loggedMessages = {
-	proxy: {
-		logged: false,
-		text: 'Failed to load resource: net::ERR_PROXY_CONNECTION_FAILED',
-	},
-	http404: {
-		logged: false,
-		text: 'the server responded with a status of 404',
-	},
-};
+addConsoleSuppression('Failed to load resource: net::ERR_PROXY_CONNECTION_FAILED');
+addConsoleSuppression('the server responded with a status of 404');
+
 /**
  * Set of console logging types observed to protect against unexpected yet
  * handled (i.e. not catastrophic) errors or warnings. Each key corresponds
@@ -143,19 +133,11 @@ function observeConsoleLogging() {
 
 		const logFunction = OBSERVED_CONSOLE_MESSAGE_TYPES[ type ];
 
-		// Limit warnings on missing resources.
-		let previouslyLogged = false;
-		Object.keys( loggedMessages ).forEach( function( key ) {
-			if ( text.includes( loggedMessages[ key ].text ) ) {
-				if ( loggedMessages[ key ].logged ) {
-					previouslyLogged = true;
-				}
-				loggedMessages[ key ].logged = true;
-			}
-		} );
-		if ( previouslyLogged ) {
+		// Limit repeated warnings.
+		if ( consoleShouldSuppress( text ) ) {
 			return;
 		}
+
 		// As of Puppeteer 1.6.1, `message.text()` wrongly returns an object of
 		// type JSHandle for error logging, instead of the expected string.
 		//

tests/e2e/env/utils/filter-console.js

@@ -0,0 +1,60 @@
+/**
+ * Suppress console messages
+ */
+
+const messagesToSuppress = [];
+
+/**
+ * Check whether the text is from a console message that should be suppressed
+ *
+ * @param text
+ * @returns {boolean}
+ */
+const consoleShouldSuppress = ( text ) => {
+	let shouldSuppress = false;
+	for ( let m = 0; m < messagesToSuppress.length; m++ ) {
+		if ( text.indexOf( messagesToSuppress[ m ].text ) < 0 ) {
+			continue;
+		}
+
+		shouldSuppress = messagesToSuppress[ m ].logged;
+		messagesToSuppress[ m ].logged = true;
+		break;
+	}
+	return shouldSuppress;
+};
+
+/**
+ * Add a partial string match to suppress console logging of repetitive messages
+ * @param searchString
+ * @param logFirstInstance
+ */
+const addConsoleSuppression = ( searchString, logFirstInstance = true ) => {
+	messagesToSuppress.push( {
+		text: searchString,
+		logged: ! Boolean( logFirstInstance ),
+	});
+};
+
+/**
+ * Remove a partial string match from suppressed console logging
+ * @param searchString
+ */
+const removeConsoleSuppression = ( searchString ) => {
+	let toRemove = -1;
+	for ( let m = 0; m < messagesToSuppress.length; m++ ) {
+		if ( messagesToSuppress[ m ].text == searchString ) {
+			toRemove = m;
+			break;
+		}
+	}
+	if ( toRemove >= 0 ) {
+		messagesToSuppress.splice( toRemove, 1 );
+	}
+};
+
+module.exports = {
+	consoleShouldSuppress,
+	addConsoleSuppression,
+	removeConsoleSuppression,
+};

tests/e2e/env/utils/index.js

@@ -2,6 +2,7 @@ const getAppRoot = require( './app-root' );
 const { getAppName, getAppBase } = require( './app-name' );
 const { getTestConfig, getAdminConfig } = require( './test-config' );
 const takeScreenshotFor = require( './take-screenshot' );
+const consoleUtils = require( './filter-console' );
 
 module.exports = {
 	getAppBase,
@@ -10,4 +11,5 @@ module.exports = {
 	getTestConfig,
 	getAdminConfig,
 	takeScreenshotFor,
+	...consoleUtils,
 };