codeceptjs 3.5.3 → 3.5.4

package/docs/build/Protractor.js

@@ -821,12 +821,13 @@ class Protractor extends Helper {
    * I.seeInField('#searchform input','Search');
    * ```
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    */
   async seeInField(field, value) {
-    return proceedSeeInField.call(this, 'assert', field, value);
+    const _value = (typeof value === 'boolean') ? value : value.toString();
+    return proceedSeeInField.call(this, 'assert', field, _value);
   }
 
   /**
@@ -839,12 +840,13 @@ class Protractor extends Helper {
    * ```
    * 
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    */
   async dontSeeInField(field, value) {
-    return proceedSeeInField.call(this, 'negate', field, value);
+    const _value = (typeof value === 'boolean') ? value : value.toString();
+    return proceedSeeInField.call(this, 'negate', field, _value);
   }
 
   /**
@@ -1645,7 +1647,7 @@ class Protractor extends Helper {
       const stream = fs.createWriteStream(outputFile);
       stream.write(Buffer.from(png, 'base64'));
       stream.end();
-      return new Promise(resolve => stream.on('finish', resolve));
+      return new Promise(resolve => stream.on('finish', resolve)); // eslint-disable-line no-promise-executor-return
     };
 
     const res = await this._locate(locator);
@@ -1680,7 +1682,7 @@ class Protractor extends Helper {
       const stream = fs.createWriteStream(outputFile);
       stream.write(Buffer.from(png, 'base64'));
       stream.end();
-      return new Promise(resolve => stream.on('finish', resolve));
+      return new Promise(resolve => stream.on('finish', resolve)); // eslint-disable-line no-promise-executor-return
     };
 
     if (!fullPage) {
@@ -2458,8 +2460,11 @@ class Protractor extends Helper {
       const body = document.body;
       const html = document.documentElement;
       window.scrollTo(0, Math.max(
-        body.scrollHeight, body.offsetHeight,
-        html.clientHeight, html.scrollHeight, html.offsetHeight
+        body.scrollHeight,
+        body.offsetHeight,
+        html.clientHeight,
+        html.scrollHeight,
+        html.offsetHeight
       ));
     });
     /* eslint-enable */

package/docs/build/Puppeteer.js

@@ -23,7 +23,7 @@ const {
   screenshotOutputFolder,
   getNormalizedKeyAttributeValue,
   isModifierKey,
-  requireWithFallback,
+  requireWithFallback, normalizeSpacesInString,
 } = require('../utils');
 const {
   isColorProperty,
@@ -69,7 +69,7 @@ const consoleLogStore = new Console();
  * @prop {boolean} [manualStart=false] - do not start browser before a test, start it manually inside a helper with `this.helpers["Puppeteer"]._startBrowser()`.
  * @prop {string} [browser=chrome] - can be changed to `firefox` when using [puppeteer-firefox](https://codecept.io/helpers/Puppeteer-firefox).
  * @prop {object} [chrome] - pass additional [Puppeteer run options](https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#puppeteerlaunchoptions).
- * @prop {boolean} [highlightElement] - highlight the interacting elements
+ * @prop {boolean} [highlightElement] - highlight the interacting elements. Default: false
 */
 const config = {};
 
@@ -231,6 +231,7 @@ class Puppeteer extends Helper {
       keepBrowserState: false,
       show: false,
       defaultPopupAction: 'accept',
+      highlightElement: false,
     };
 
     return Object.assign(defaults, config);
@@ -857,8 +858,11 @@ class Puppeteer extends Helper {
       const body = document.body;
       const html = document.documentElement;
       window.scrollTo(0, Math.max(
-        body.scrollHeight, body.offsetHeight,
-        html.clientHeight, html.scrollHeight, html.offsetHeight,
+        body.scrollHeight,
+        body.offsetHeight,
+        html.clientHeight,
+        html.scrollHeight,
+        html.offsetHeight,
       ));
     });
   }
@@ -1756,7 +1760,7 @@ class Puppeteer extends Helper {
       await this._evaluateHandeInContext(el => el.innerHTML = '', el);
     }
 
-    highlightActiveElement.call(this, el, this.page);
+    highlightActiveElement.call(this, el, await this._getContext());
     await el.type(value.toString(), { delay: this.options.pressKeyDelay });
 
     return this._waitForAction();
@@ -1797,7 +1801,7 @@ class Puppeteer extends Helper {
   async appendField(field, value) {
     const els = await findVisibleFields.call(this, field);
     assertElementExists(els, field, 'Field');
-    highlightActiveElement.call(this, els[0], this.page);
+    highlightActiveElement.call(this, els[0], await this._getContext());
     await els[0].press('End');
     await els[0].type(value.toString(), { delay: this.options.pressKeyDelay });
     return this._waitForAction();
@@ -1814,12 +1818,13 @@ class Puppeteer extends Helper {
    * I.seeInField('#searchform input','Search');
    * ```
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    */
   async seeInField(field, value) {
-    return proceedSeeInField.call(this, 'assert', field, value);
+    const _value = (typeof value === 'boolean') ? value : value.toString();
+    return proceedSeeInField.call(this, 'assert', field, _value);
   }
 
   /**
@@ -1832,12 +1837,13 @@ class Puppeteer extends Helper {
    * ```
    * 
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    */
   async dontSeeInField(field, value) {
-    return proceedSeeInField.call(this, 'negate', field, value);
+    const _value = (typeof value === 'boolean') ? value : value.toString();
+    return proceedSeeInField.call(this, 'negate', field, _value);
   }
 
   /**
@@ -1900,7 +1906,7 @@ class Puppeteer extends Helper {
     if (await el.getProperty('tagName').then(t => t.jsonValue()) !== 'SELECT') {
       throw new Error('Element is not <select>');
     }
-    highlightActiveElement.call(this, els[0], this.page);
+    highlightActiveElement.call(this, els[0], await this._getContext());
     if (!Array.isArray(option)) option = [option];
 
     for (const key in option) {
@@ -3438,7 +3444,7 @@ async function proceedClick(locator, context = null, options = {}) {
     assertElementExists(els, locator, 'Clickable element');
   }
 
-  highlightActiveElement.call(this, els[0], this.page);
+  highlightActiveElement.call(this, els[0], await this._getContext());
 
   await els[0].click(options);
   const promises = [];
@@ -3498,7 +3504,7 @@ async function proceedSee(assertType, text, context, strict = false) {
   if (strict) {
     return allText.map(elText => equals(description)[assertType](text, elText));
   }
-  return stringIncludes(description)[assertType](text, allText.join(' | '));
+  return stringIncludes(description)[assertType](normalizeSpacesInString(text), normalizeSpacesInString(allText.join(' | ')));
 }
 
 async function findCheckable(locator, context) {
@@ -3793,7 +3799,7 @@ function getNormalizedKey(key) {
 }
 
 function highlightActiveElement(element, context) {
-  if (!this.options.enableHighlight && !store.debugMode) return;
+  if (!this.options.highlightElement && !store.debugMode) return;
 
   highlightElement(element, context);
 }

package/docs/build/TestCafe.js

@@ -20,7 +20,7 @@ const { urlEquals } = require('../assert/equal');
 const { empty } = require('../assert/empty');
 const { truth } = require('../assert/truth');
 const {
-  xpathLocator,
+  xpathLocator, normalizeSpacesInString,
 } = require('../utils');
 const Locator = require('../locator');
 
@@ -933,9 +933,9 @@ class TestCafe extends Helper {
   async see(text, context = null) {
     let els;
     if (context) {
-      els = (await findElements.call(this, this.context, context)).withText(text);
+      els = (await findElements.call(this, this.context, context)).withText(normalizeSpacesInString(text));
     } else {
-      els = (await findElements.call(this, this.context, '*')).withText(text);
+      els = (await findElements.call(this, this.context, '*')).withText(normalizeSpacesInString(text));
     }
 
     return this.t
@@ -1091,18 +1091,19 @@ class TestCafe extends Helper {
    * I.seeInField('#searchform input','Search');
    * ```
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    */
   async seeInField(field, value) {
+    const _value = (typeof value === 'boolean') ? value : value.toString();
     // const expectedValue = findElements.call(this, this.context, field).value;
     const els = await findFields.call(this, field);
     assertElementExists(els, field, 'Field');
     const el = await els.nth(0);
 
     return this.t
-      .expect(await el.value).eql(value)
+      .expect(await el.value).eql(_value)
       .catch(mapError);
   }
 
@@ -1116,18 +1117,19 @@ class TestCafe extends Helper {
    * ```
    * 
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    */
   async dontSeeInField(field, value) {
+    const _value = (typeof value === 'boolean') ? value : value.toString();
     // const expectedValue = findElements.call(this, this.context, field).value;
     const els = await findFields.call(this, field);
     assertElementExists(els, field, 'Field');
     const el = await els.nth(0);
 
     return this.t
-      .expect(el.value).notEql(value)
+      .expect(el.value).notEql(_value)
       .catch(mapError);
   }
 
@@ -1502,8 +1504,11 @@ class TestCafe extends Helper {
       const body = document.body;
       const html = document.documentElement;
       window.scrollTo(0, Math.max(
-        body.scrollHeight, body.offsetHeight,
-        html.clientHeight, html.scrollHeight, html.offsetHeight,
+        body.scrollHeight,
+        body.offsetHeight,
+        html.clientHeight,
+        html.scrollHeight,
+        html.offsetHeight,
       ));
     }).with({ boundTestRun: this.t })().catch(mapError);
   }
@@ -1926,7 +1931,9 @@ class TestCafe extends Helper {
 }
 
 async function waitForFunction(browserFn, waitTimeout) {
-  const pause = () => new Promise((done => setTimeout(done, 50)));
+  const pause = () => new Promise((done => {
+    setTimeout(done, 50);
+  }));
 
   const start = Date.now();
   // eslint-disable-next-line no-constant-condition

package/docs/build/WebDriver.js

@@ -62,7 +62,7 @@ const webRoot = 'body';
  * @prop {object} [desiredCapabilities] Selenium's [desired capabilities](https://github.com/SeleniumHQ/selenium/wiki/DesiredCapabilities).
  * @prop {boolean} [manualStart=false] - do not start browser before a test, start it manually inside a helper with `this.helpers["WebDriver"]._startBrowser()`.
  * @prop {object} [timeouts] [WebDriver timeouts](http://webdriver.io/docs/timeouts.html) defined as hash.
- * @prop {boolean} [highlightElement] - highlight the interacting elements
+ * @prop {boolean} [highlightElement] - highlight the interacting elements. Default: false
  */
 const config = {};
 
@@ -429,6 +429,7 @@ class WebDriver extends Helper {
       keepCookies: false,
       keepBrowserState: false,
       deprecationWarnings: false,
+      highlightElement: false,
     };
 
     // override defaults with config
@@ -1713,13 +1714,14 @@ class WebDriver extends Helper {
    * I.seeInField('#searchform input','Search');
    * ```
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    *
    */
   async seeInField(field, value) {
-    return proceedSeeField.call(this, 'assert', field, value);
+    const _value = (typeof value === 'boolean') ? value : value.toString();
+    return proceedSeeField.call(this, 'assert', field, _value);
   }
 
   /**
@@ -1732,13 +1734,14 @@ class WebDriver extends Helper {
    * ```
    * 
    * @param {CodeceptJS.LocatorOrString} field located by label|name|CSS|XPath|strict locator.
-   * @param {string} value value to check.
+   * @param {CodeceptJS.StringOrSecret} value value to check.
    * ⚠️ returns a _promise_ which is synchronized internally by recorder
    * 
    *
    */
   async dontSeeInField(field, value) {
-    return proceedSeeField.call(this, 'negate', field, value);
+    const _value = (typeof value === 'boolean') ? value : value.toString();
+    return proceedSeeField.call(this, 'negate', field, _value);
   }
 
   /**
@@ -2970,7 +2973,9 @@ class WebDriver extends Helper {
    * 
    */
   async wait(sec) {
-    return new Promise(resolve => setTimeout(resolve, sec * 1000));
+    return new Promise(resolve => {
+      setTimeout(resolve, sec * 1000);
+    });
   }
 
   /**
@@ -3135,20 +3140,18 @@ class WebDriver extends Helper {
     const aSec = sec || this.options.waitForTimeoutInSeconds;
     const _context = context || this.root;
 
-    return this.browser.waitUntil(
-      async () => {
-        const res = await this.$$(withStrictLocator.call(this, _context));
-        if (!res || res.length === 0) return false;
-        const selected = await forEachAsync(res, async el => this.browser.getElementText(getElementId(el)));
-        if (Array.isArray(selected)) {
-          return selected.filter(part => part.indexOf(text) >= 0).length > 0;
-        }
-        return selected.indexOf(text) >= 0;
-      }, {
-        timeout: aSec * 1000,
-        timeoutMsg: `element (${_context}) is not in DOM or there is no element(${_context}) with text "${text}" after ${aSec} sec`,
-      },
-    );
+    return this.browser.waitUntil(async () => {
+      const res = await this.$$(withStrictLocator.call(this, _context));
+      if (!res || res.length === 0) return false;
+      const selected = await forEachAsync(res, async el => this.browser.getElementText(getElementId(el)));
+      if (Array.isArray(selected)) {
+        return selected.filter(part => part.indexOf(text) >= 0).length > 0;
+      }
+      return selected.indexOf(text) >= 0;
+    }, {
+      timeout: aSec * 1000,
+      timeoutMsg: `element (${_context}) is not in DOM or there is no element(${_context}) with text "${text}" after ${aSec} sec`,
+    });
   }
 
   /**
@@ -3168,20 +3171,18 @@ class WebDriver extends Helper {
     const client = this.browser;
     const aSec = sec || this.options.waitForTimeoutInSeconds;
 
-    return client.waitUntil(
-      async () => {
-        const res = await findFields.call(this, field);
-        if (!res || res.length === 0) return false;
-        const selected = await forEachAsync(res, async el => el.getValue());
-        if (Array.isArray(selected)) {
-          return selected.filter(part => part.indexOf(value) >= 0).length > 0;
-        }
-        return selected.indexOf(value) >= 0;
-      }, {
-        timeout: aSec * 1000,
-        timeoutMsg: `element (${field}) is not in DOM or there is no element(${field}) with value "${value}" after ${aSec} sec`,
-      },
-    );
+    return client.waitUntil(async () => {
+      const res = await findFields.call(this, field);
+      if (!res || res.length === 0) return false;
+      const selected = await forEachAsync(res, async el => el.getValue());
+      if (Array.isArray(selected)) {
+        return selected.filter(part => part.indexOf(value) >= 0).length > 0;
+      }
+      return selected.indexOf(value) >= 0;
+    }, {
+      timeout: aSec * 1000,
+      timeoutMsg: `element (${field}) is not in DOM or there is no element(${field}) with value "${value}" after ${aSec} sec`,
+    });
   }
 
   /**
@@ -3525,8 +3526,11 @@ class WebDriver extends Helper {
       const body = document.body;
       const html = document.documentElement;
       window.scrollTo(0, Math.max(
-        body.scrollHeight, body.offsetHeight,
-        html.clientHeight, html.scrollHeight, html.offsetHeight
+        body.scrollHeight,
+        body.offsetHeight,
+        html.clientHeight,
+        html.scrollHeight,
+        html.offsetHeight
       ));
     });
     /* eslint-enable */
@@ -4075,7 +4079,7 @@ function isModifierKey(key) {
 }
 
 function highlightActiveElement(element) {
-  if (!this.options.enableHighlight && !store.debugMode) return;
+  if (!this.options.highlightElement && !store.debugMode) return;
 
   highlightElement(element, this.browser);
 }

package/docs/changelog.md

@@ -7,11 +7,180 @@ layout: Section
 
 # Releases
 
+## 3.5.4
+
+🐛 Bug Fixes:
+ * **[Playwright]** When passing `userDataDir`, it throws error after test execution ([#3814](https://github.com/codeceptjs/CodeceptJS/issues/3814)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+ * [CodeceptJS-CLI] Improve command to generate types ([#3788](https://github.com/codeceptjs/CodeceptJS/issues/3788)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+ * Heal plugin fix ([#3820](https://github.com/codeceptjs/CodeceptJS/issues/3820)) - by **[davert](https://github.com/davert)**
+ * Fix for error in using `all` with `run-workers` ([#3805](https://github.com/codeceptjs/CodeceptJS/issues/3805)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+```js
+  helpers: {
+    Playwright: {
+      url: 'https://github.com',
+      show: false,
+      browser: 'chromium',
+      waitForNavigation: 'load',
+      waitForTimeout: 30_000,
+      trace: true,
+      keepTraceForPassedTests: true
+    },
+  },
+  multiple: {
+    profile1: {
+      browsers: [
+        {
+          browser: "chromium",
+        }
+      ]
+    },
+  },
+```
+ * Highlight elements issues ([#3779](https://github.com/codeceptjs/CodeceptJS/issues/3779)) ([#3778](https://github.com/codeceptjs/CodeceptJS/issues/3778)) - by **[philkas](https://github.com/philkas)**
+ * Support `&nbsp` symbol in `I.see` method ([#3815](https://github.com/codeceptjs/CodeceptJS/issues/3815)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+
+```js
+// HTML code uses   instead of space
+<div class="dJHe_" style="color: rgb(255, 255, 255);">My&nbsp;Text!</div>
+
+I.see("My Text!") // this test would work with both &nbsp; and space
+```
+
+📖 Documentation
+ * Improve the configuration of electron testing when the app is build with electron-forge ([#3802](https://github.com/codeceptjs/CodeceptJS/issues/3802)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+
+```js
+const path = require("path");
+
+exports.config = {
+  helpers: {
+    Playwright: {
+      browser: "electron",
+      electron: {
+        executablePath: require("electron"),
+        args: [path.join(__dirname, ".webpack/main/index.js")],
+      },
+    },
+  },
+  // rest of config
+}
+```
+
+🛩️ Features
+
+#### **[Playwright]** new features and improvements
+ * Parse the response in recording network steps ([#3771](https://github.com/codeceptjs/CodeceptJS/issues/3771)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+
+```js
+      const traffics = await I.grabRecordedNetworkTraffics();
+      expect(traffics[0].url).to.equal('https://reqres.in/api/comments/1');
+      expect(traffics[0].response.status).to.equal(200);
+      expect(traffics[0].response.body).to.contain({ name: 'this was mocked' });
+
+      expect(traffics[1].url).to.equal('https://reqres.in/api/comments/1');
+      expect(traffics[1].response.status).to.equal(200);
+      expect(traffics[1].response.body).to.contain({ name: 'this was another mocked' });
+```
+ * Grab metrics ([#3809](https://github.com/codeceptjs/CodeceptJS/issues/3809)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+
+```js
+const metrics = await I.grabMetrics();
+
+// returned metrics
+
+[
+  { name: 'Timestamp', value: 1584904.203473 },
+  { name: 'AudioHandlers', value: 0 },
+  { name: 'AudioWorkletProcessors', value: 0 },
+  { name: 'Documents', value: 22 },
+  { name: 'Frames', value: 10 },
+  { name: 'JSEventListeners', value: 366 },
+  { name: 'LayoutObjects', value: 1240 },
+  { name: 'MediaKeySessions', value: 0 },
+  { name: 'MediaKeys', value: 0 },
+  { name: 'Nodes', value: 4505 },
+  { name: 'Resources', value: 141 },
+  { name: 'ContextLifecycleStateObservers', value: 34 },
+  { name: 'V8PerContextDatas', value: 4 },
+  { name: 'WorkerGlobalScopes', value: 0 },
+  { name: 'UACSSResources', value: 0 },
+  { name: 'RTCPeerConnections', value: 0 },
+  { name: 'ResourceFetchers', value: 22 },
+  { name: 'AdSubframes', value: 0 },
+  { name: 'DetachedScriptStates', value: 2 },
+  { name: 'ArrayBufferContents', value: 1 },
+  { name: 'LayoutCount', value: 0 },
+  { name: 'RecalcStyleCount', value: 0 },
+  { name: 'LayoutDuration', value: 0 },
+  { name: 'RecalcStyleDuration', value: 0 },
+  { name: 'DevToolsCommandDuration', value: 0.000013 },
+  { name: 'ScriptDuration', value: 0 },
+  { name: 'V8CompileDuration', value: 0 },
+  { name: 'TaskDuration', value: 0.000014 },
+  { name: 'TaskOtherDuration', value: 0.000001 },
+  { name: 'ThreadTime', value: 0.000046 },
+  { name: 'ProcessTime', value: 0.616852 },
+  { name: 'JSHeapUsedSize', value: 19004908 },
+  { name: 'JSHeapTotalSize', value: 26820608 },
+  { name: 'FirstMeaningfulPaint', value: 0 },
+  { name: 'DomContentLoaded', value: 1584903.690491 },
+  { name: 'NavigationStart', value: 1584902.841845 }
+]
+```
+
+* Grab WebSocket (WS) messages ([#3789](https://github.com/codeceptjs/CodeceptJS/issues/3789)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+  * `flushWebSocketMessages`
+  * `grabWebSocketMessages`
+  * `startRecordingWebSocketMessages`
+  * `stopRecordingWebSocketMessages`
+
+```js
+await I.startRecordingWebSocketMessages();
+I.amOnPage('https://websocketstest.com/');
+I.waitForText('Work for You!');
+I.flushNetworkTraffics();
+const wsMessages = I.grabWebSocketMessages();
+expect(wsMessages.length).to.equal(0);
+```
+
+```js
+await I.startRecordingWebSocketMessages();
+await I.amOnPage('https://websocketstest.com/');
+I.waitForText('Work for You!');
+const wsMessages = I.grabWebSocketMessages();
+expect(wsMessages.length).to.greaterThan(0);
+```
+
+```js
+await I.startRecordingWebSocketMessages();
+await I.amOnPage('https://websocketstest.com/');
+I.waitForText('Work for You!');
+const wsMessages = I.grabWebSocketMessages();
+await I.stopRecordingWebSocketMessages();
+await I.amOnPage('https://websocketstest.com/');
+I.waitForText('Work for You!');
+const afterWsMessages = I.grabWebSocketMessages();
+expect(wsMessages.length).to.equal(afterWsMessages.length);
+```
+
+* Move from `ElementHandle` to `Locator`. This change is quite major, but it happened under hood, so should not affect your code.  ([#3738](https://github.com/codeceptjs/CodeceptJS/issues/3738)) - by **[KobeNguyenT](https://github.com/KobeNguyenT)**
+
 ## 3.5.3
 
 🛩️ Features
 
-* **[Playwright]** Provide new steps to check network traffic [#3748](https://github.com/codeceptjs/CodeceptJS/issues/3748) - by **[ngraf](https://github.com/ngraf)** **[KobeNguyenT](https://github.com/KobeNguyenT)**
+* **[Playwright]** Added commands to check network traffic [#3748](https://github.com/codeceptjs/CodeceptJS/issues/3748) - by **[ngraf](https://github.com/ngraf)** **[KobeNguyenT](https://github.com/KobeNguyenT)**
+  * `startRecordingTraffic`
+  * `grabRecordedNetworkTraffics`
+  * `blockTraffic`
+  * `mockTraffic`
+  * `flushNetworkTraffics`
+  * `stopRecordingTraffic`
+  * `seeTraffic`
+  * `grabTrafficUrl`
+  * `dontSeeTraffic`
+
+Examples:
 
 ```js
 // recording traffics and verify the traffic

package/docs/community-helpers.md

@@ -31,9 +31,6 @@ Please **add your own** by editing this page.
 * [codeceptjs-bshelper](https://github.com/PeterNgTr/codeceptjs-bshelper) - a helper which updates `Test Names` & `Test Results` on Browserstack 
 * [codeceptjs-tbhelper](https://github.com/testingbot/codeceptjs-tbhelper) - a helper which updates `Test Names` & `Test Results` on TestingBot 
 
-## Integrations
-* [codeceptjs-testrail](https://github.com/PeterNgTr/codeceptjs-testrail) - a plugin to integrate with [Testrail](https://www.gurock.com/testrail)
-
 ## Visual-Testing
 * [codeceptjs-resemblehelper](https://github.com/puneet0191/codeceptjs-resemblehelper) - a helper which helps with visual testing using resemble.js. 
 * [codeceptjs-applitoolshelper](https://www.npmjs.com/package/codeceptjs-applitoolshelper) - a helper which helps interaction with [Applitools](https://applitools.com)
@@ -42,8 +39,10 @@ Please **add your own** by editing this page.
 ## Reporters
 * [codeceptjs-rphelper](https://github.com/reportportal/agent-js-codecept) is a CodeceptJS helper which can publish tests results on ReportPortal after execution.
 * [codeceptjs-xray-helper](https://www.npmjs.com/package/codeceptjs-xray-helper) is a CodeceptJS helper which can publish tests results on [XRAY](https://confluence.xpand-it.com/display/XRAYCLOUD/Import+Execution+Results+-+REST).
+* [codeceptjs-xray-cloud-helper](https://www.npmjs.com/package/codeceptjs-xray-cloud-helper) is a helper that automatically retrieves the result of CodeceptJS tests and sends them to XRAY/JIRA(cloud version) via [XRAY Cloud API](https://docs.getxray.app/display/XRAYCLOUD/Import+Execution+Results+-+REST+v2#ImportExecutionResultsRESTv2-XrayJSONresults).
 * [codeceptjs-slack-reporter](https://www.npmjs.com/package/codeceptjs-slack-reporter) Get a Slack notification when one or more scenarios fail.
 * [codeceptjs-browserlogs-plugin](https://github.com/pavkam/codeceptjs-browserlogs-plugin) Record the browser logs for failed tests.
+* [codeceptjs-testrail](https://github.com/PeterNgTr/codeceptjs-testrail) - a plugin to integrate with [Testrail](https://www.gurock.com/testrail)
 
 ## Browser request control
 * [codeceptjs-resources-check](https://github.com/luarmr/codeceptjs-resources-check) Load a URL with Puppeteer and listen to the requests while the page is loading. Enabling count the number or check the sizes of the requests.
@@ -55,4 +54,9 @@ Please **add your own** by editing this page.
 ## Other
 
 * [codeceptjs-cmdhelper](https://github.com/thiagodp/codeceptjs-cmdhelper) allows you to run commands in the terminal/console
-* [eslint-plugin-codeceptjs](https://www.npmjs.com/package/eslint-plugin-codeceptjs) Eslint rules for CodeceptJS.
+* [eslint-plugin-codeceptjs](https://www.npmjs.com/package/eslint-plugin-codeceptjs) Eslint rules for CodeceptJS.
+* [codeceptjs-datalayer-helper](https://github.com/kobenguyent/codeceptjs-datalayer-helper) CodeceptJS DataLayer helper helps you to get the datalayer JavaScript array that is used to store information and send this data to the tag manager.
+* [codeceptjs-a11y-helper](https://github.com/kobenguyent/codeceptjs-a11y-helper) accessibility tests integrated with CodeceptJS - Playwright-axe
+* [codeceptjs-lighthouse-helper](https://github.com/kobenguyent/codeceptjs-lighthouse-helper) lighthouse audit integrated with CodeceptJS - Playwright
+* [Snowplow Data analytics](https://www.npmjs.com/package/@viasat/codeceptjs-snowplow-helper) - Test your Snowplow events implementations with CodeceptJS and Snowplow Micro.
+* [codeceptjs-failure-logger](https://github.com/kobenguyent/codeceptjs-failure-logger) - Log failed CodeceptJS tests to file

package/docs/examples.md

@@ -16,6 +16,7 @@ Playground repository where you can run tests in different helpers on a basic si
 
 Tests repository demonstrate usage of
 
+* Playwright helper
 * Puppeteer helper
 * WebDriver helper
 * TestCafe plugin
@@ -28,7 +29,6 @@ Tests repository demonstrate usage of
 CodeceptJS repo contains basic tests (both failing and passing) just to show how it works.
 Our team uses it to test new features and run simple scenarios.
 
-
 ## [CodeceptJS Cucumber E2E Framework](https://github.com/gkushang/codeceptjs-e2e)
 
 This repository contains complete E2E framework for CodeceptJS with Cucumber and SauceLabs Integration
@@ -146,4 +146,10 @@ This is necessary if all integrations with TMS and CI/CD are already configured,
 * HTTP request client with session support and unit tests
 * Exemplary code control
 * Ready to launch in a CI/CD system as is
-* OOP, Test data models and builders, endpoint decorators
+* OOP, Test data models and builders, endpoint decorators
+
+## [Playwright fun with CodeceptJS](https://github.com/PeterNgTr/codeceptjs-playwright-fun)
+* Tests are written in TS
+* CI/CD with Github Actions
+* Page Object Model is applied
+* ReportPortal Integration