Keboola Dev Tools

A Chrome extension that provides developer tools for Keboola Connection, helping developers avoid common manual API calls when working with component configurations.

Features

• Show Storage Token: Quick access to your Keboola Storage API token
• Debug Run: Execute component configurations in debug mode
• Enable Processors: Quickly enable processors for your configurations
• Run Custom Docker Tags: Test specific Docker image tags without updating configuration
• Configuration Management: View and edit component configurations directly from the browser
• State Management: View and update component state data

Installation

From Chrome Web Store

(Coming soon)

Manual Installation (Development)

1. Clone this repository:

   git clone https://github.com/davidesner/chrome-extension-keboola-dev-tools.git
   cd chrome-extension-keboola-dev-tools

2. Open Chrome and navigate to chrome://extensions/

3. Enable Developer mode (toggle in the top-right corner)

4. Click Load unpacked and select the repository root directory

5. The Keboola Dev Tools extension should now appear in your extensions list

Usage

1. Navigate to any Keboola Connection component configuration page (e.g., https://connection.keboola.com/admin/projects/[project-id]/extractors/...)

2. Click the Keboola Dev Tools extension icon in your browser toolbar

3. Use the available tools:

   • Show Storage Token: Display and copy your project's Storage API token
   • Debug Run: Execute the current configuration in debug mode
   • Enable Processors: Enable processors for the configuration
   • Run Tag: Enter a custom Docker image tag and run it
   • Update Configuration: Edit and save configuration JSON
   • Update State: Edit and save component state data

Development

Project Structure

.
├── manifest.json          # Extension manifest (MV3)
├── popup.html            # Main popup UI
├── popup.js              # Popup logic and API calls
├── background.js         # Service worker
├── options.html          # Extension options page
├── options.js            # Options page logic
├── main.css              # Custom styles
├── css/                  # Vendor stylesheets (Bootstrap)
├── js/                   # Vendor scripts (jQuery, Bootstrap)
└── images/               # Extension icons and assets

Making Changes

1. Make your changes to the code
2. Go to chrome://extensions/
3. Click the Reload button on the Keboola Dev Tools extension card
4. Test your changes by using the extension on a Keboola project page

Building for Distribution

Package the extension for Chrome Web Store submission:

mkdir -p dist
zip -r dist/keboola-dev-tools.zip images css js *.html *.js manifest.json

Testing

This extension relies on manual testing. For any change:

1. Test the popup UI on a real Keboola project URL
2. Verify API calls with a test Storage API token
3. Check the browser Network tab for successful API responses (2xx status)
4. Monitor the browser console for any errors

Contributing

We welcome contributions! Here's how you can help:

1. Fork the repository

2. Create a feature branch:

   git checkout -b feature/your-feature-name

3. Make your changes following our coding style:

   • Use ES6+ JavaScript with const/let
   • Use 4-space indentation
   • Use camelCase for function names
   • Keep network helpers in popup.js
   • Add inline comments for non-obvious logic

4. Test your changes thoroughly:

   • Test on multiple Keboola component configuration pages
   • Verify API calls work correctly
   • Check for console errors

5. Commit your changes:

   git commit -m "FEATURE: Add your feature description"

   • Use imperative, uppercase prefixes (FEATURE, FIX, UPDATE)
   • Keep commit messages clear and concise

6. Push to your fork:

   git push origin feature/your-feature-name

7. Open a Pull Request:

   • Describe the motivation for your changes
   • List any UI or API changes
   • Include before/after screenshots for UI changes
   • Describe manual test steps performed

Security Guidelines

• Never commit real tokens or project IDs
• Use sample/placeholder values in code examples
• Don't log sensitive data to the console or DOM
• Treat packaged ZIPs as build artifacts (don't commit them)

License

This project is licensed under the MIT License - see the LICENSE file for details.

Authors

Created with love by Keboola fans:

• David Esner
• Jiri Hauser
• Jakub Turner

Support

For issues, questions, or suggestions, please open an issue on GitHub.

Acknowledgments

• Built for the Keboola Connection platform
• Uses Bootstrap for UI components
• Chrome Manifest V3 extension