Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
223 changes: 223 additions & 0 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,223 @@
# Contributing to LocatorPro for Playwright

Thank you for your interest in contributing to LocatorPro! We welcome contributions from the community and are excited to see what you'll bring to the project.

## 🚀 Getting Started

### Prerequisites
- Node.js 18+ or 20+
- npm or yarn
- Git

### Development Setup

1. **Fork and clone the repository**
```bash
git clone https://github.com/YOUR_USERNAME/locatorpro-playwright.git
cd locatorpro-playwright
```

2. **Install dependencies**
```bash
npm install
```

3. **Start the local test server**
```bash
npm start
# Server runs on http://localhost:3000
```

4. **Run tests to ensure everything works**
```bash
npm test
npm run test:headed # Run with browser UI
```

5. **Build the project**
```bash
npm run build
```

## 🧪 Testing

### Running Tests
- `npm test` - Run all Playwright tests
- `npm run test:headed` - Run tests with browser visible
- `npm run test:ui` - Interactive test runner
- `npm run build` - TypeScript compilation

### Test Structure
- `tests/core-functionality.spec.ts` - Core SmartLocator methods
- `tests/related-text.spec.ts` - Revolutionary findByRelatedText features
- `tests/self-healing.spec.ts` - Self-healing and pattern analysis
- `test-site/` - Local test site with comprehensive scenarios

### Writing Tests
When adding new features, please include tests that cover:
- Happy path scenarios
- Edge cases and error conditions
- Cross-browser compatibility
- Performance considerations

## 📝 Code Style

### TypeScript Guidelines
- Use strict TypeScript with proper type definitions
- Follow existing code patterns and naming conventions
- Add JSDoc comments for public methods
- Use meaningful variable and function names

### Formatting
We use standard TypeScript formatting. The project will auto-format on build.

## 🎯 Types of Contributions

### 🐛 Bug Reports
Please use the GitHub issue template and include:
- Clear description of the issue
- Steps to reproduce
- Expected vs actual behavior
- Browser and environment details
- Minimal code example

### ✨ Feature Requests
For new features, please:
- Check existing issues first
- Describe the use case and benefit
- Provide examples of how it would work
- Consider backward compatibility

### 🔧 Code Contributions

#### Pull Request Process
1. **Create a feature branch**
```bash
git checkout -b feature/your-feature-name
```

2. **Make your changes**
- Follow the existing code style
- Add/update tests as needed
- Update documentation if necessary

3. **Test your changes**
```bash
npm test
npm run build
```

4. **Commit with clear messages**
```bash
git commit -m "feat: add smart pattern recognition for form inputs"
# or
git commit -m "fix: handle timeout errors in generateStrategies"
```

5. **Push and create PR**
```bash
git push origin feature/your-feature-name
```

#### Commit Message Format
We follow conventional commits:
- `feat:` - New feature
- `fix:` - Bug fix
- `docs:` - Documentation changes
- `test:` - Adding or updating tests
- `refactor:` - Code refactoring
- `perf:` - Performance improvements
- `chore:` - Maintenance tasks

## 🎯 Priority Areas for Contribution

### High Priority
- **New locator strategies** - Additional ways to find elements
- **Performance optimizations** - Faster strategy generation
- **Cross-browser testing** - Ensure compatibility
- **Documentation improvements** - Examples and guides

### Medium Priority
- **Framework integrations** - Jest, Cucumber, etc.
- **Visual regression detection** - Image-based locators
- **Machine learning patterns** - Smarter pattern recognition
- **Accessibility improvements** - Better ARIA support

### Good First Issues
- **Bug fixes** - Small, well-defined issues
- **Documentation updates** - README improvements
- **Test coverage** - Additional test scenarios
- **Code examples** - Real-world usage examples

## 📚 Development Guidelines

### Architecture Overview
```
src/
├── index.ts # Main exports
├── smart-locator.ts # Core SmartLocator class
├── locator-engine.ts # Strategy generation engine
└── types.ts # TypeScript type definitions
```

### Key Components
- **SmartLocator** - Main class with public API
- **LocatorEngine** - Strategy generation and DOM analysis
- **Strategy System** - Prioritized fallback mechanisms
- **Pattern Analysis** - Broken selector intelligence

### Adding New Features
1. **Update types** in `src/types.ts`
2. **Implement logic** in appropriate files
3. **Add public methods** to `SmartLocator` class
4. **Write comprehensive tests**
5. **Update documentation**

## 🤝 Community Guidelines

### Code of Conduct
- Be respectful and inclusive
- Provide constructive feedback
- Help newcomers get started
- Maintain professional communication

### Getting Help
- **GitHub Discussions** - General questions and ideas
- **GitHub Issues** - Bug reports and feature requests
- **Discord/Slack** - Real-time community chat (if available)

## 📋 Review Process

### What We Look For
- **Code quality** - Clean, readable, maintainable code
- **Test coverage** - Comprehensive test scenarios
- **Documentation** - Clear explanations and examples
- **Backward compatibility** - Don't break existing functionality
- **Performance** - Consider impact on execution speed

### Review Timeline
- Initial response: 2-3 business days
- Code review: 3-5 business days
- Final approval: 1-2 business days

## 🎉 Recognition

Contributors will be:
- Added to the contributors list
- Mentioned in release notes
- Invited to become maintainers (for significant contributions)

## 📞 Questions?

Feel free to reach out:
- **GitHub Issues** - For bug reports and feature requests
- **GitHub Discussions** - For general questions
- **Email** - [maintainer email if available]

---

Thank you for contributing to LocatorPro! Together, we're making Playwright automation more reliable and accessible for everyone. 🚀

## 📄 License

By contributing to LocatorPro, you agree that your contributions will be licensed under the MIT License.
18 changes: 16 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,25 @@
> **Revolutionary Self-Healing Locator System for Playwright**
> Transform fragile selectors into intelligent, self-healing locators with automatic fallback strategies.

[![npm version](https://badge.fury.io/js/locatorpro-playwright.svg)](https://badge.fury.io/js/locatorpro-playwright)
[![npm version](https://badge.fury.io/js/locatorpro-playwright.svg)](https://github.com/debasisj/locatorpro-playwright)
Copy link

Copilot AI Aug 18, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The npm version badge should link to the npm package page, not the GitHub repository. The link should remain as https://badge.fury.io/js/locatorpro-playwright or point to https://www.npmjs.com/package/locatorpro-playwright.

Suggested change
[![npm version](https://badge.fury.io/js/locatorpro-playwright.svg)](https://github.com/debasisj/locatorpro-playwright)
[![npm version](https://badge.fury.io/js/locatorpro-playwright.svg)](https://www.npmjs.com/package/locatorpro-playwright)

Copilot uses AI. Check for mistakes.
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
[![Tests](https://github.com/debasisj/locatorpro-playwright/actions/workflows/ci.yml/badge.svg)](https://github.com/debasisj/locatorpro-playwright/actions/workflows/ci.yml)


## 🚀 **Why LocatorPro?**

**Playwright already has excellent built-in locators** like `getByRole()`, `getByText()`, and `getByTestId()` that are robust and reliable. These should be your first choice for most scenarios.

**However, you need LocatorPro when:**
- Working with **legacy applications** where you can't control the markup
- Dealing with **dynamically generated IDs** or **changing class names**
- Elements lack proper **test IDs** or **semantic roles**
- You need to find elements by **contextual relationships** (e.g., "Add to Cart" button for a specific product)
- **Migrating existing tests** with fragile selectors without rewriting everything
- Building tests for **third-party applications** where you can't modify the HTML

LocatorPro **enhances** Playwright's locators with intelligent fallbacks and contextual awareness, making your tests resilient in scenarios where standard locators fall short.

**Traditional Playwright tests break when:**
- IDs change: `#submit-btn-123` → `#submit-btn-456` ❌
- Classes are renamed: `.old-button` → `.new-button` ❌
Expand Down Expand Up @@ -413,7 +427,7 @@ We welcome contributions! Please see [CONTRIBUTING.md](CONTRIBUTING.md) for guid

### **Development Setup**
```bash
git clone https://github.com/your-org/locatorpro-playwright.git
git clone https://github.com/debasisj/locatorpro-playwright.git
cd locatorpro-playwright
npm install
npm run test
Expand Down