Skip to content

Commit 5d0ec88

Browse files
claudeclaude
committed
Improve SEO targeting QA and testing traffic
- manifest.json: rename extension to "Exploratory Testing - QA Bug Reporter" and rewrite description with QA/manual testing keywords (132 chars) - README.md: full rewrite with SEO-optimised content — keyword-rich headings, feature comparison table, use cases, related topics tags, and proper alt text on images; targets searches around exploratory testing, manual QA, bug reporting, screenshot annotation and test session management - HTMLReport/preview.html: add meta description, keywords, robots and Open Graph tags so shared/hosted reports are indexable https://claude.ai/code/session_01C61StUcx2ezUfAyVr4Btcx
1 parent c170ac4 commit 5d0ec88

3 files changed

Lines changed: 137 additions & 43 deletions

File tree

‎HTMLReport/preview.html‎

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,13 @@
44
<head>
55
<meta charset="utf-8">
66
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7-
<title>Exploratory Testing Session Report</title>
7+
<title>Exploratory Testing Session Report — QA Bug & Test Annotation Log</title>
8+
<meta name="description" content="Exploratory testing session report. View bugs, notes, ideas and questions captured during manual QA testing, with annotated screenshots, URLs and timestamps.">
9+
<meta name="keywords" content="exploratory testing, manual testing, QA report, bug report, test session, software testing, quality assurance, screenshot annotation, test documentation">
10+
<meta name="robots" content="index, follow">
11+
<meta property="og:title" content="Exploratory Testing Session Report">
12+
<meta property="og:description" content="QA session report with bugs, notes, ideas and annotated screenshots captured during exploratory testing.">
13+
<meta property="og:type" content="website">
814
<link rel="stylesheet" href="preview.css">
915
<script type="module" src="preview.js"></script>
1016
<script src="../lib/chart.umd.js"></script>

‎README.md‎

Lines changed: 128 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,64 +1,152 @@
1-
# A Chrome Extension for Exploratory Testing
1+
# Exploratory Testing Chrome Extension — QA Bug Reporter & Test Session Manager
22

3-
A Chrome extension designed for making web exploratory testing easier
3+
> A free Chrome extension for manual and exploratory testing. Capture bugs, ideas, notes and questions with annotated screenshots — without breaking your testing flow.
44
5-
**Features**
5+
[![Chrome Web Store](https://img.shields.io/badge/Chrome%20Web%20Store-Install-blue?logo=google-chrome)](https://chrome.google.com/webstore/detail/exploratory-testing-chrom/khigmghadjljgjpamimgjjmpmlbgmekj)
6+
[![Version](https://img.shields.io/badge/version-4.1.0-green)](https://github.com/morvader/ExploratoryTestingChromeExtension/releases)
7+
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](LICENSE)
68

7-
- Report bugs, ideas, notes and questions easily
8-
- Take screenshots during the session. Keep focused
9-
- URL will be tracked automatically
10-
- See session results in a report
11-
- Export and import sessions
12-
- Export session to JSON, CSV or HTML
9+
---
10+
11+
## What Is Exploratory Testing?
12+
13+
**Exploratory testing** is a manual QA technique where testers simultaneously design and execute tests, learning about the application as they go. It's especially effective for uncovering edge cases, usability bugs, and unexpected behavior that scripted test cases miss.
14+
15+
This extension was built specifically to support exploratory testing sessions: it stays out of your way while you test, and lets you record findings instantly with a single click.
16+
17+
---
18+
19+
## Key Features for QA Testers
20+
21+
| Feature | Description |
22+
|---|---|
23+
| **Bug reporting** | Log bugs instantly with description and screenshot |
24+
| **Annotated screenshots** | Draw arrows, boxes and text directly on screenshots |
25+
| **Notes & ideas** | Capture observations and improvement ideas mid-session |
26+
| **Questions** | Flag questions for developers or product owners |
27+
| **Automatic URL tracking** | Every annotation records the page URL automatically |
28+
| **Session management** | Start, pause, reset or export full testing sessions |
29+
| **HTML test report** | Visual session summary with charts and filterable table |
30+
| **CSV export** | Open your test session data in Excel or any spreadsheet |
31+
| **JSON export/import** | Share or archive full sessions with all metadata |
32+
| **Zero context switching** | Annotate without leaving the page you're testing |
33+
34+
---
35+
36+
## Why Use This for Manual & Exploratory Testing?
37+
38+
- **QA teams** running sprint testing cycles need a fast way to capture findings without filling bug trackers mid-session.
39+
- **Solo testers** doing acceptance testing or regression checks can record everything in one place.
40+
- **UX reviewers** and **product teams** use it to collect notes and ideas during demos or reviews.
41+
- **Bug triage** is easier with screenshots already annotated and linked to the original URL.
42+
43+
---
44+
45+
## Screenshots
46+
47+
**Add a bug, note, idea or question in one click — stay focused on testing**
48+
49+
<img src="./screenshots/new_Annotation.PNG" width="440" alt="Exploratory testing extension popup showing bug, note, idea and question buttons">
50+
51+
**View a full session report with charts, filters and export options**
52+
53+
<img src="./screenshots/report.PNG" width="800" alt="HTML test session report with annotation table, type distribution chart and export buttons">
54+
55+
---
56+
57+
## Installation
58+
59+
Install directly from the **[Chrome Web Store](https://chrome.google.com/webstore/detail/exploratory-testing-chrom/khigmghadjljgjpamimgjjmpmlbgmekj)**.
1360

61+
Or load unpacked for development — see [Development Setup](#development-and-testing) below.
1462

15-
Install from [Chrome Store](https://chrome.google.com/webstore/detail/exploratory-testing-chrom/khigmghadjljgjpamimgjjmpmlbgmekj)
63+
---
64+
65+
## How It Works
66+
67+
1. **Start a testing session** — open the extension popup and begin exploring the application under test.
68+
2. **Record findings instantly** — click Bug / Note / Idea / Question, add a description, optionally capture and annotate a screenshot.
69+
3. **Keep testing** — the extension tracks URLs automatically. All annotations are saved to local storage.
70+
4. **Export your session** — generate an HTML report, export to CSV for your test management tool, or save as JSON.
1671

72+
---
1773

18-
**Annotate any thought while you test easily and take screenshots without changing context**
74+
## Annotation Types
1975

20-
<img src="./screenshots/new_Annotation.PNG" width="440">
76+
| Type | Use case |
77+
|---|---|
78+
| 🐛 **Bug** | Defect or unexpected behavior found during testing |
79+
| 📝 **Note** | Observations, context or things to follow up on |
80+
| 💡 **Idea** | Improvement suggestions or new test scenarios |
81+
| ❓ **Question** | Clarifications needed from devs or product owners |
2182

83+
---
2284

23-
**View session results in a report**
85+
## Export & Reporting
2486

25-
<img src="./screenshots/report.PNG" width="800">
87+
- **HTML Report** — standalone file with embedded screenshots, filterable annotation table and session statistics chart. Shareable with stakeholders without any dependencies.
88+
- **CSV Export** — compatible with Excel, Google Sheets, Jira, TestRail and other test management tools.
89+
- **JSON Export/Import** — full session serialization for archiving, sharing between testers, or re-importing later.
90+
91+
---
2692

2793
## Development and Testing
2894

29-
This section provides instructions for setting up the project locally for development and running tests.
95+
### Prerequisites
96+
97+
- [Node.js](https://nodejs.org/) (includes npm)
3098

3199
### Project Setup
32100

33-
1. **Prerequisites**: Ensure you have [Node.js](https://nodejs.org/) installed (which includes npm).
34-
2. **Clone the Repository**:
35-
```bash
36-
git clone https://github.com/your-username/your-repo-name.git
37-
cd your-repo-name
38-
```
39-
*(Using a common placeholder format for the repo URL. The user can update this if they wish).*
40-
3. **Install Dependencies**:
41-
```bash
42-
npm install
43-
```
44-
This will install Jest, Babel, and other necessary development dependencies as defined in `package.json`.
101+
```bash
102+
git clone https://github.com/morvader/ExploratoryTestingChromeExtension.git
103+
cd ExploratoryTestingChromeExtension
104+
npm install
105+
```
45106

46107
### Running Tests
47108

48-
The project uses [Jest](https://jestjs.io/) for unit testing.
109+
```bash
110+
npm test # Run all Jest unit tests
111+
npx jest # Run Jest directly
112+
npx jest --watch # Watch mode for TDD
113+
```
114+
115+
> **Known issue:** `test/spec/ExportSessionCSV.test.js` has a syntax error from a Jest migration and will fail. All other test suites pass.
116+
117+
### E2E Tests
118+
119+
```bash
120+
npx playwright test # Run Playwright end-to-end tests
121+
```
49122

50-
1. **Execute Tests**:
51-
```bash
52-
npm test
53-
```
54-
Alternatively, you can run Jest directly:
55-
```bash
56-
npx jest
57-
```
58-
2. **Test Results**: Most tests should pass.
59-
* **Known Issue**: The test suite for `test/spec/ExportSessionCSV.test.js` is currently non-functional due to a syntax error that occurred during the migration to Jest and could not be resolved with available tools. This specific suite will fail or be skipped. All other test suites should pass.
123+
See [TESTING-E2E.md](TESTING-E2E.md) for the full E2E testing guide.
124+
125+
### Build for Chrome Web Store
126+
127+
```powershell
128+
.\genetareZip.ps1 # Creates a timestamped .zip ready for upload
129+
```
130+
131+
---
132+
133+
## Tech Stack
134+
135+
- **Manifest V3** Chrome Extension
136+
- jQuery 1.11.3 + Bootstrap CSS (popup UI)
137+
- Chart.js (session report charts)
138+
- JSZip (screenshot ZIP download)
139+
- Jest 29 + Babel (unit tests)
140+
- Playwright (E2E tests)
60141

61142
---
62-
_PS: I'm not a web designer, so any help with web design or UX will be appreciated._
63143

64-
twitter: @morvader
144+
## Related Topics
145+
146+
`exploratory-testing` · `manual-testing` · `qa-tool` · `bug-reporting` · `chrome-extension` · `test-session-management` · `screenshot-annotation` · `software-testing` · `quality-assurance` · `test-automation`
147+
148+
---
149+
150+
_Contributions welcome. Not a web designer — UI/UX improvements are especially appreciated._
151+
152+
Twitter: [@morvader](https://twitter.com/morvader)

‎manifest.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
{
22
"manifest_version": 3,
3-
"name": "Exploratory Testing Extension",
3+
"name": "Exploratory Testing - QA Bug Reporter",
44
"version": "4.1.0",
5-
"description": "Chrome extension for exploratory testing",
5+
"description": "Manual testing tool for QA teams. Report bugs, ideas & notes with annotated screenshots. Export sessions as CSV, JSON or HTML.",
66
"permissions": [
77
"storage",
88
"tabs",

0 commit comments

Comments
 (0)