Skip to main content
Thank you for your interest in contributing to Trydent! We welcome and appreciate contributions from the community. This document outlines the guidelines to follow when contributing to the project.

​
Installation: Manual

  1. Ensure you have the required prerequisites installed:
  2. Fork the Trydent repository to your own GitHub account.
  3. Clone your forked repository to your local machine:
git clone https://github.com/<your-github-username>/trydent.git
  1. Navigate to the root project directory and install dependencies:
cd trydent
npm install
  1. Navigate to the client directory and install dependencies:
cd client
npm install
  1. In the client directory, build the application:
npm run build
  1. Load Trydent into your Chrome extensions.
    • Open Google Chrome and navigate to chrome://extensions/
    • Enable Developer Mode
    • Click “Load unpacked” and select the extensions directory in your local Trydent repository.
Now you should be able to access Trydent in the developer tools or right-click and select Trydent.
Trydent is a tool aimed to provide a better experience for developers in creating E2E tests.
Therefore, it is recommended to familiarize yourself with the Trydent documentation.
Please ensure you have read the documentation before contributing to the project.

​
Coding Standards

Follow these coding standards when contributing to Trydent:

ESLint

Use ESLint to ensure your code adheres to the project’s style guidelines.

JSDocs

Write comments to explain code following the JSDoc format. Also, use descriptive variable and function names.

Modularization

Organize your code into logical units and separate files as needed.

​
File Structure

.
├── LICENSE
├── README.md
├── client
│   ├── assets
│   │   ├── testing-tamed.png
│   │   └── trydent-banner.png
│   ├── components
│   │   ├── App.tsx
│   │   ├── TopBar.tsx
│   │   └── pages
│   │       ├── CodeBlock.tsx
│   │       ├── TestPage.tsx
│   │       └── WelcomePage.tsx
│   ├── index.html
│   ├── jest.config.js
│   ├── main.tsx
│   ├── package-lock.json
│   ├── package.json
│   ├── scss
│   │   ├── _codeBlock.scss
│   │   ├── _eventLogger.scss
│   │   ├── _styles.scss
│   │   ├── _testPage.scss
│   │   ├── _topBar.scss
│   │   ├── _variables.scss
│   │   ├── _welcomePage.scss
│   │   └── application.scss
│   ├── tsconfig.json
│   ├── tsconfig.node.json
│   ├── utils
│   │   ├── testCreator.ts
│   │   └── types
│   │       └── types.ts
│   └── vite.config.ts
├── extension
│   ├── assets
│   │   ├── icon128.png
│   │   ├── icon16.png
│   │   └── icon48.png
│   ├── background.js
│   ├── bundles
│   │   ├── assets
│   │   │   ├── buttons.esm.js
│   │   │   ├── index.css
│   │   │   └── index.js
│   │   ├── components
│   │   │   ├── App.js
│   │   │   ├── TopBar.js
│   │   │   └── pages
│   │   │       ├── CodeBlock.js
│   │   │       ├── TestPage.js
│   │   │       └── WelcomePage.js
│   │   ├── index.html
│   │   ├── main.js
│   │   ├── utils
│   │   │   ├── testCreator.js
│   │   │   └── types
│   │   │       └── types.js
│   │   └── vite.config.js
│   ├── content-script.js
│   ├── devtool.html
│   ├── devtools.js
│   ├── manifest.json
│   ├── panel.html
│   └── panel.js
├── package-lock.json
├── package.json
└── server
    ├── index.ts
    ├── package-lock.json
    ├── package.json
    └── tsconfig.json

​
Chrome Developer Resources

If you’re new to Chrome extension development, we recommend checking out the official Chrome Developer Docs to get started.

​
Feature Development and Code Contribution Process

  1. Create a new branch in your forked repository for each feature or bug fix.
  2. Write clear, concise, and well-documented code following the project’s coding standards.
  3. Add or update tests to cover your changes.
  4. Ensure all tests pass and your code adheres to the project’s style guidelines.
  5. Commit your changes and push your branch to your forked repository.
  6. Submit a pull request (PR) to the main Trydent repository’s ‘dev’ branch with a clear description of your changes.

​
Issue Tracking and Bug Reporting

Before submitting a new issue or bug report, please search the existing issues to avoid duplicates. When creating a new issue, include the following information:

Clear Description

Include a clear and concise description of the issue or feature request as well as steps to reproduce the issue (if applicable)

Expected vs Actual

Describe expected behavior and actual behavior (for bug reports).

Pictures

Include screenshots, logs, or error messages (if applicable).

​
Review Process

Once you submit a PR, the project maintainers will review your changes. They may request changes or provide feedback. Address any requested changes promptly to ensure your PR can be merged in a timely manner.

​
Trydent Website

The Trydent website can be updated here.

​
Stretch Features to Implement

  • Add support for more granular events
  • Add support for utilizing multiple it statements
  • Add support for deletion of inputs without breaking test (ie: a click event before a type event shouldn’t be able to be deleted without deleting the type event first)
  • Adding support to editing existing tests
  • More robust xPath generation (currently only supports xPath generation for elements with an id attribute)
  • Add ability to run the test from the extension
Thank you for contributing to Trydent!