Testing Twill

Twill provides some dusk testing helpers to make it easy to get basic coverage of your cms's functionality.

# Setup Laravel dusk

# Installation

Depending on your setup, you can add Laravel dusk using composer require --dev laravel/dusk

Then you need to install the base files: php artisan dusk:install

You will also need to install Google Chrome and then install the correct browser driver:

php artisan dusk:chrome-driver --detect

Finally you can generate a first test using:

# Generating a test file

php artisan dusk:make MyModuleTest

# More

See Laravel documentation for more details

# Authenticating

In order to login into the cms you need a user and login.

1$this->artisan('twill:superadmin user@example.org password');
2 
3$this->browse(function(Browser $browser) {
4    $browser->loginAs(\App\Models\User::firstWhere('email', 'user@example.org'), 'twill_users');
5});

# Dusk helpers

From within a dusk test you can run the following macro's:

visitTwill: Visit the admin panel.

1$this->browse(function(Browser $browser) {
2    $browser->visitTwill();
3});

createModuleEntryWithTitle: Create a specific module edit page.

1$this->browse(function(Browser $browser) {
2    $browser->visitTwill();
3    $browser->createModuleEntryWithTitle('Partners', 'Twill');
4});

visitModuleEntryWithTitle: Visit a specific module edit page.

1$this->browse(function(Browser $browser) {
2    $browser->visitTwill();
3    $browser->visitModuleEntryWithTitle('Partners', 'Twill');
4});

assertVselectHasOptions: Check if a select field has given options.

The first parameter is the selector by which the field identifies.

1$this->browse(function(Browser $browser) {
2    $browser->visitTwill();
3    $browser->visitModuleEntryWithTitle('Partners', 'Twill');
4    $browser->assertVselectHasOptions('.input-wrapper-option', ['option1', 'option2']);
5});

selectVselectOption: Select a given option.

The first parameter is the selector by which the field identifies.

1$this->browse(function(Browser $browser) {
2    $browser->visitTwill();
3    $browser->visitModuleEntryWithTitle('Partners', 'Twill');
4    $browser->selectVselectOption('.input-wrapper-option', 'option1');
5});

assertVselectHasOptionSelected: Check if a given option is selected.

The first parameter is the selector by which the field identifies.

1$this->browse(function(Browser $browser) {
2    $browser->visitTwill();
3    $browser->visitModuleEntryWithTitle('Partners', 'Twill');
4    $browser->selectVselectOption('.input-wrapper-option', 'option1');
5    $browser->assertVselectHasOptionSelected('.input-wrapper-option', 'option1');
6});

pressSaveAndCheckSaved: Save and check that the save was successfully.

1$this->browse(function(Browser $browser) {
2    $browser->visitTwill();
3    $browser->visitModuleEntryWithTitle('Partners', 'Twill');
4    $browser->pressSaveAndCheckSaved();
5});

addBlockWithContent: Add a new block and set the content.

 1$this->browse(function(Browser $browser) {
 2    $browser->visitTwill();
 3    $browser->visitModuleEntryWithTitle('Partners', 'Twill');
 4 
 5    $browser->addBlockWithContent('Text', [ 
 6        'Title' => 'This is the title',
 7        'Text' => 'This is the wysiwyg'
 8    ]); 
 9 
10    $browser->pressSaveAndCheckSaved('Save as draft');
11});

withinNewBlock: Same ass add block with content but for more manual control.

$prefix is the block identifier which is prefixed for block fields.

 1$this->browse(function(Browser $browser) {
 2    $browser->visitTwill();
 3    $browser->visitModuleEntryWithTitle('Partners', 'Twill');
 4 
 5    $browser->withinNewBlock('Text', function(Browser $browser, string $prefix) { 
 6        $browser->type($prefix . '[title][en]', 'Hello world');
 7    });
 8 
 9    $browser->pressSaveAndCheckSaved('Save as draft');
10});

withinEditor: Opens the editor for the current page, allows you to interact and then closes it.

dragBlock: Allows you to drag a block in the editor. (When running in headed mode, this may not work as it uses your cursor)

 1$this->browse(function(Browser $browser) {
 2    $browser->visitTwill();
 3 
 4    $browser->createModuleEntryWithTitle('Page', 'Example page');
 5 
 6    $browser->withinEditor(function (Browser $editor) { 
 7        $editor->dragBlock('Text', function (Browser $block, string $prefix) {
 8            $block->type($prefix . '[title][en]', 'Hello world');
 9        });
10    }); 
11 
12    $browser->pressSaveAndCheckSaved('Save as draft');
13});