Initial commit

skills/browser-compatibility-tester/SKILL.md

@@ -0,0 +1,55 @@
+---
+name: conducting-browser-compatibility-tests
+description: |
+  This skill enables cross-browser compatibility testing for web applications using BrowserStack, Selenium Grid, or Playwright. It tests across Chrome, Firefox, Safari, and Edge, identifying browser-specific bugs and ensuring consistent functionality. It is used when a user requests to "test browser compatibility", "run cross-browser tests", or uses the `/browser-test` or `/bt` command to assess web application behavior across different browsers and devices. The skill generates a report detailing compatibility issues and screenshots for visual verification. Activates when you request "conducting browser compatibility tests" functionality.
+allowed-tools: Read, Write, Edit, Grep, Glob, Bash
+version: 1.0.0
+---
+
+## Overview
+
+This skill automates cross-browser compatibility testing, ensuring that web applications function correctly across various browsers and devices. It leverages BrowserStack, Selenium Grid, and Playwright to execute tests and identify browser-specific issues.
+
+## How It Works
+
+1. **Configuring Browser Matrix**: Defines the target browsers (Chrome, Firefox, Safari, Edge), versions, operating systems, and device configurations for testing.
+2. **Generating Cross-Browser Tests**: Creates and configures tests to run across the defined browser matrix, handling browser-specific quirks and setting up parallel execution for efficiency.
+3. **Executing Tests**: Runs the tests in parallel using BrowserStack, Selenium Grid, or Playwright, capturing screenshots and logs for analysis.
+4. **Generating Compatibility Report**: Compiles a detailed report highlighting any compatibility issues, including screenshots and error logs, for easy identification and resolution.
+
+## When to Use This Skill
+
+This skill activates when you need to:
+- Ensure a web application functions correctly across different browsers and devices.
+- Identify browser-specific bugs or compatibility issues.
+- Automate cross-browser testing as part of a CI/CD pipeline.
+
+## Examples
+
+### Example 1: Testing a new feature
+
+User request: "Test browser compatibility for the new shopping cart feature."
+
+The skill will:
+1. Configure the browser matrix with the latest versions of Chrome, Firefox, Safari, and Edge.
+2. Execute tests specifically targeting the shopping cart functionality across the configured browsers.
+3. Generate a report highlighting any compatibility issues encountered with the shopping cart feature, including screenshots.
+
+### Example 2: Regression testing after an update
+
+User request: "/bt"
+
+The skill will:
+1. Use the default browser matrix (or a previously defined configuration).
+2. Run all existing tests across the configured browsers and devices.
+3. Provide a comprehensive report detailing any regressions or new compatibility issues introduced by the recent update.
+
+## Best Practices
+
+- **Configuration**: Clearly define the target browser matrix to ensure comprehensive testing.
+- **Test Design**: Write tests that are robust and cover a wide range of user interactions.
+- **Report Analysis**: Carefully analyze the generated reports to identify and address compatibility issues promptly.
+
+## Integration
+
+This skill can be integrated into a CI/CD pipeline using other tools to automate cross-browser testing as part of the deployment process. It can also work with issue tracking systems to automatically create tickets for identified compatibility bugs.

skills/browser-compatibility-tester/assets/README.md

@@ -0,0 +1,7 @@
+# Assets
+
+Bundled resources for browser-compatibility-tester skill
+
+- [ ] test_templates/basic_test.py A basic test template for different browsers.
+- [ ] report_templates/compatibility_report.html An HTML template for generating compatibility reports.
+- [ ] example_configurations/browserstack.yml Example BrowserStack configuration file.

skills/browser-compatibility-tester/references/README.md

@@ -0,0 +1,8 @@
+# References
+
+Bundled resources for browser-compatibility-tester skill
+
+- [ ] browserstack_api_docs.md Comprehensive documentation for the BrowserStack API.
+- [ ] selenium_grid_config.md Example configurations for Selenium Grid.
+- [ ] playwright_best_practices.md Best practices for writing Playwright tests.
+- [ ] cross_browser_testing_checklist.md A checklist of common cross-browser compatibility issues.

skills/browser-compatibility-tester/scripts/README.md

@@ -0,0 +1,7 @@
+# Scripts
+
+Bundled resources for browser-compatibility-tester skill
+
+- [ ] browserstack_config_generator.py Generates BrowserStack configuration files based on user input.
+- [ ] selenium_grid_setup.sh Sets up a Selenium Grid for local testing.
+- [ ] playwright_test_runner.py Executes Playwright tests and generates reports.