Dakka is an open source development tool which provides a simple and fast solution to generate end-to-end tests by recording events fired on the page.  Generated events can be exported or copied to clipboard for further modification and execution.  Dakka currently supports testing tools such as -  Playwright ,  Cypress ,  Puppeteer .   Installation   In order to install Dakka Chrome extension click  Dakka . This will take you to Chrome Web Store. On Chrome Web Store page click Add To Chrome button to install Dakka.  User Actions Once user starts recording, Dakka will catch: Mouse clicks, double-clicks and right button clicks Keyboard inputs including meta and special keys File uploads Browser navigation Screen resize Not only Dakka tracks events for the page, but also for all its iframes (all origins supported!).  Generate first test After installing Dakka - open chrome developer tools and select Dakka. To open the developer console in Google Chrome, open the Chrome Menu in the upper-right-hand corner of the browser window and select More Tools > Developer Tools. You can also use Option + ⌘ + J (on macOS) To start using the tool click  Enable  button -  Dakka does not collect  or store any data from your browser. Click on the  Record  button and start interacting with the page.  Actions fired on the page will be displayed on Dakka Panel:  Selectors You can choose the selectors for the elements from the dropdown above the action block. Selectors are sorted by priority with recommendations when to use. Hover over the green, yellow or red icons to see how many elements are found with the current selector on the page. If test fails with one of the selectors you can choose another one from the dropdown.  Assertions  To add assertions hover over the floating plus sign at the bottom-right corner and drag and drop assertion block before or after an event block. There are two options two pick an element to assert - locate the element on the page or add the element manually.  Export the generated test The final step is to export the created test. Currently Dakka supports three popular testing tools - Cypress, Playwright and Puppeteer. Choose the preferred one and save the test either by downloading as a file or copying to clipboard. Add the generated test your project and run.  Test cases creation Dakka allows not only the single test recording and creation, but also the comprehensive test cases setup:  

Introduction

Generated test can be either copied to clipboard or downloaded as a file. Before exporting the test choose the testing tool you want to run the test with -  Cypress, Playwright, Puppeteer.  Once exported add the test to your project to run it:  Alternatively, you can open the generated test in the extension's popup by clicking the action icon:     

Export and Execution

Choosing the correct element selector can be time consuming if you need to write lot of test cases. Dakka solves this problem by suggesting list of the selectors sorted by priority - recommended, occasionally recommended and not recommended.  How to choose selector? 1.  Selector should be  unique , it should select target element on the page. 2. Selector should be  stable , it should not be based on the attribute that changes frequently. 3. Selector needs to be  concise , it should readable and easy to understand.    Not recommended, examples: cy.get('button').click -  Too generic. cy.get('.dropdown-menu').click() -  Coupled to styling. Highly subject to change.      Occasionally recommended, examples: cy.get('#todos').click() -  Better but coupled to styling or JS event listeners.   Recommended, examples: cy.get('[data-test-id="test-example"]').click() -  Isolated from all changes. cy.get('[data-cy="delete"]').click() -  cy.contains('Delete User').click() -  Good, but still coupled to text content that may change. How to identify multiple elements for the chosen selector? Sometimes element selector isn't unique, meaning that there are more than one element with the given selector on the page. By default the first element on the page will be used in exported test. In order to see how many elements are found for the given selector hover over the recommendations icon:   If the exported test fails try to select different element selector or adjust the events to your needs.   

Element Selectors

1.  How to install Dakka? Install  Dakka Chrome extension  plugin 2.   How to add an assertion? Hover over the plus icon and drag and drop assertion block before or after the event. 3.  How to export a test? Choose the testing tool from the  Export As  dropdown, it can be Cypress, Playwright or Puppeteer. Click the Copy or Save button next to the  Export As  dropdown. 4.  Can Dakka be used on browser other than Chrome? Currently Dakka is supported only on Chrome and can be installed as an Chrome extension. 5.  Can I delete events from the Dakka Panel if I recorded a wrong action? If you have accidentally recorded unnecessary event you can delete it by click on the delete button at the bottom of the event block.  

Assertion blocks are converted to assertion logic after exporting the test. To add an assertion drag and drop the assertion block before or after an event block. You can either locate the element or add the element selector manually. The dropdown suggests the assertion logic you can add to your test. The assertion values are populated by can be manually edited.     

Dakka

Open source test generation tool

Generate tests for Cypress, Playwright and Puppeteer