Merge pull request #1 from shayan-bstack/main

feat:codecept-playwright-sdk-launch

Author: SaranshBS

.gitignore

@@ -0,0 +1,7 @@
+node_modules
+playwright-report
+test-results
+log/
+package-lock.json
+local.log
+output/

README.md

@@ -1,2 +1,32 @@
-# codecept-js-playwright-browserstack
-Sample code for running sessions with Codecept Playwright on Browserstack
+# CodeceptJS-Playwright-Browserstack
+
+# Integrating Playwright <a href="https://playwright.dev/docs/intro"><img src="https://playwright.dev/img/playwright-logo.svg" alt="Node.js" height="22" /></a>  and CodeceptJS <a href="https://codecept.io/"><img src="https://codecept.io/logo.svg" alt="Node.js" height="22" /></a> with BrowserStack <a href="https://browserstack.com"><img src="https://raw.githubusercontent.com/browserstack/MSTest-playwright-browserstack/main/assets/browserstack.png" alt="BrowserStack" height="22" /></a>
+
+
+## Setup
+*  Clone the repo `git clone https://github.com/browserstack/codecept-js-playwright-browserstack.git`.
+*  Run `cd codecept-js-playwright-browserstack`.
+*  Install dependencies `npm install`
+
+
+## Running your tests
+
+- To run the sample tests in parallel across the platforms specified in the `browserstack.yml`, run `npm run sample-test`.
+- To run the sample local tests in parallel across the platforms specified in the `browserstack.yml`, run `npm run sample-local-test`.
+
+## Notes
+* You can export the environment variables for the Username and Access Key of your BrowserStack account. 
+
+  ```
+  export BROWSERSTACK_USERNAME=<browserstack-username> &&
+  export BROWSERSTACK_ACCESS_KEY=<browserstack-access-key>
+  ```
+* You can view your test results on the [BrowserStack Automate dashboard](https://www.browserstack.com/automate)
+* Understand how many parallel sessions you need by using our [Parallel Test Calculator](https://www.browserstack.com/automate/parallel-calculator?ref=github)
+
+## Addtional Resources
+* [Documentation for writing Automate test scripts in CodeceptJS](https://codecept.io/helpers/WebDriver/#webdriver)
+* [Documentation for playwright](https://playwright.dev/docs/intro)
+* [Customizing your tests on BrowserStack](https://www.browserstack.com/automate/capabilities)
+
+

browserstack.yml

@@ -0,0 +1,81 @@
+# =============================
+# Set BrowserStack Credentials
+# =============================
+# Add your BrowserStack userName and accessKey here or set BROWSERSTACK_USERNAME and
+# BROWSERSTACK_ACCESS_KEY as env variables
+userName: YOUR_USERNAME
+accessKey: YOUR_ACCESS_KEY
+
+# ======================
+# BrowserStack Reporting
+# ======================
+# The following capabilities are used to set up reporting on BrowserStack:
+# Set 'projectName' to the name of your project. Example, Marketing Website
+projectName: BrowserStack Samples 
+# Set `buildName` as the name of the job / testsuite being run
+buildName: browserstack build 
+# `buildIdentifier` is a unique id to differentiate every execution that gets appended to
+# buildName. Choose your buildIdentifier format from the available expressions:
+# ${BUILD_NUMBER} (Default): Generates an incremental counter with every execution
+# ${DATE_TIME}: Generates a Timestamp with every execution. Eg. 05-Nov-19:30
+# Read more about buildIdentifiers here -> https://www.browserstack.com/docs/automate/selenium/organize-tests
+buildIdentifier: '#${BUILD_NUMBER}' # Supports strings along with either/both ${expression}
+
+# =======================================
+# Platforms (Browsers / Devices to test)
+# =======================================
+# Platforms object contains all the browser / device combinations you want to test on.
+# Entire list available here -> (https://www.browserstack.com/list-of-browsers-and-platforms/automate)
+platforms:
+  - os: Windows
+    osVersion: 11
+    browserName: chrome
+    browserVersion: latest
+  - os: OS X
+    osVersion: Ventura
+    browserName: playwright-webkit
+    browserVersion: latest
+  - os: Windows
+    osVersion: 11
+    browserName: playwright-firefox
+    browserVersion: latest
+
+# =======================
+# Parallels per Platform
+# =======================
+# The number of parallel threads to be used for each platform set.
+# BrowserStack's SDK runner will select the best strategy based on the configured value
+#
+# Example 1 - If you have configured 3 platforms and set `parallelsPerPlatform` as 2, a total of 6 (2 * 3) parallel threads will be used on BrowserStack
+#
+# Example 2 - If you have configured 1 platform and set `parallelsPerPlatform` as 5, a total of 5 (1 * 5) parallel threads will be used on BrowserStack
+parallelsPerPlatform: 1
+
+# ==========================================
+# BrowserStack Local
+# (For localhost, staging/private websites)
+# ==========================================
+# Set browserStackLocal to true if your website under test is not accessible publicly over the internet
+# Learn more about how BrowserStack Local works here -> https://www.browserstack.com/docs/automate/selenium/local-testing-introduction
+browserstackLocal: true # <boolean> (Default false)
+# browserStackLocalOptions:
+# Options to be passed to BrowserStack local in-case of advanced configurations
+  # localIdentifier: # <string> (Default: null) Needed if you need to run multiple instances of local.
+  # forceLocal: true  # <boolean> (Default: false) Set to true if you need to resolve all your traffic via BrowserStack Local tunnel.
+  # Entire list of arguments available here -> https://www.browserstack.com/docs/automate/selenium/manage-incoming-connections
+
+framework: playwright
+source: codeceptjs-playwright:sample-sdk:v1
+
+# ===================
+# Debugging features
+# ===================
+debug: false # <boolean> # Set to true if you need screenshots for every selenium command ran
+networkLogs: false # <boolean> Set to true to enable HAR logs capturing
+consoleLogs: errors # <string> Remote browser's console debug levels to be printed (Default: errors)
+# Available options are `disable`, `errors`, `warnings`, `info`, `verbose` (Default: errors)
+# CUSTOM_TAG_<INT>: # <string> (Default: parent folder name of the test file) Custom tag for your test suite
+
+# Test Observability is an intelligent test reporting & debugging product. It collects data using the SDK. Read more about what data is collected at https://www.browserstack.com/docs/test-observability/references/terms-and-conditions
+# Visit observability.browserstack.com to see your test reports and insights. To disable test observability, specify `testObservability: false` in the key below.
+testObservability: true

package.json

@@ -0,0 +1,31 @@
+{
+  "name": "codecept-js-playwright-browserstack",
+  "version": "1.0.0",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1",
+    "sample-test": "browserstack-node-sdk codeceptjs run -c src/test/sample/codecept.conf.js --steps",
+    "sample-local-test": "browserstack-node-sdk codeceptjs run -c src/test/local/codecept.conf.js --steps",
+    "postinstall": "npm update browserstack-node-sdk"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/browserstack/codecept-js-playwright-browserstack"
+  },
+  "author": "",
+  "license": "ISC",
+  "bugs": {
+    "url": "https://github.com/browserstack/codecept-js-playwright-browserstack/issues"
+  },
+  "homepage": "https://github.com/browserstack/codecept-js-playwright-browserstack#readme",
+  "devDependencies": {
+    "browserstack-node-sdk": "latest",
+    "codeceptjs": "^3.2.3",
+    "playwright": "^1.41.2"
+  },
+  "dependencies": {
+    "browserstack-local": "^1.5.2",
+    "dotenv": "^16.0.0"
+  }
+}

src/test/local/codecept.conf.js

@@ -0,0 +1,36 @@
+const browserstack = require("browserstack-local");
+const util = require('util');
+require('dotenv').config()
+
+const BROWSERSTACK_USERNAME = process.env.BROWSERSTACK_USERNAME
+const BROWSERSTACK_ACCESS_KEY = process.env.BROWSERSTACK_ACCESS_KEY
+
+exports.config = {
+    tests: './*_test.js',
+    output: './output',
+    timeout: 120,
+    helpers: {
+        Playwright: {
+          url: 'http://bs-local.com:45454/',
+          show: true,
+          restart: 'keep',
+        }
+      },
+    include: {
+        I: './steps_file.js'
+    },
+    mocha: {},
+    name: 'CodeceptJS-Playwright-BrowserStack-Local',
+    plugins: {
+        pauseOnFail: {},
+        retryFailedStep: {
+            enabled: true
+        },
+        tryTo: {
+            enabled: true
+        },
+        screenshotOnFail: {
+            enabled: true
+        }
+    }
+}

src/test/local/local_test.js

@@ -0,0 +1,9 @@
+const assert = require('assert');
+Feature('BrowserStack Local Testing');
+
+Scenario('BStack Local Test', async ({ I }) => {
+    I.amOnPage("http://bs-local.com:45454/")
+    let text = await I.grabTitle()
+    console.log(text)
+    assert.equal(text, "BrowserStack Local", "Local Instance is not runnning!")
+});

src/test/local/steps_file.js

@@ -0,0 +1,10 @@
+// in this file you can append custom step methods to 'I' object
+
+module.exports = function() {
+    return actor({
+  
+      // Define custom steps here, use 'this' to access default methods of I.
+      // It is recommended to place a general 'login' function here.
+  
+    });
+  }

src/test/sample/codecept.conf.js

@@ -0,0 +1,34 @@
+require('dotenv').config()
+const BROWSERSTACK_USERNAME = process.env.BROWSERSTACK_USERNAME
+const BROWSERSTACK_ACCESS_KEY = process.env.BROWSERSTACK_ACCESS_KEY
+
+exports.config = {
+  tests: './*_test.js',
+  output: './output',
+  timeout: 120,
+  helpers: {
+    Playwright: {
+      url: 'https://bstackdemo.com',
+      show: true,
+      restart: 'keep',
+    }
+  },
+  include: {
+    I: './steps_file.js'
+  },
+  bootstrap: null,
+  mocha: {},
+  name: 'CodeceptJS-Playwright-BrowserStack',
+  plugins: {
+    pauseOnFail: {},
+    retryFailedStep: {
+      enabled: true
+    },
+    tryTo: {
+      enabled: true
+    },
+    screenshotOnFail: {
+      enabled: true
+    }
+  }
+}

src/test/sample/sample_test.js

@@ -0,0 +1,11 @@
+const assert = require('assert');
+Feature('Add to Cart');
+
+Scenario('BStack Sample Test One', async ({ I }) => {
+    I.amOnPage("https://bstackdemo.com")
+    let expectedProductName = await I.grabTextFrom('//*[@id="1"]/p')
+    I.click('//*[@id="1"]/div[4]')
+
+    let productName = await I.grabTextFrom('//*[@id="__next"]/div/div/div[2]/div[2]/div[2]/div/div[3]/p[1]')
+    assert.equal(productName, expectedProductName, "Product Did Not Match!")
+})

src/test/sample/steps_file.js

@@ -0,0 +1,10 @@
+// in this file you can append custom step methods to 'I' object
+
+module.exports = function() {
+    return actor({
+  
+      // Define custom steps here, use 'this' to access default methods of I.
+      // It is recommended to place a general 'login' function here.
+  
+    });
+  }