Repo rebuild
This commit is contained in:
@@ -0,0 +1,107 @@
|
||||
<?php
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
namespace Modules\Helpdesk\Tests\Browser;
|
||||
|
||||
use Laravel\Dusk\Browser;
|
||||
use Modules\Helpdesk\Tests\Concerns\BuildsHelpdeskFixtures;
|
||||
use Tests\DuskTestCase;
|
||||
|
||||
/**
|
||||
* Browser regression coverage for the Helpdesk Create Ticket editor and footer actions.
|
||||
*
|
||||
* This test protects the previously-fixed regression where the create-ticket editor
|
||||
* lost its toolbar, native browser spellcheck surface, and compact Ticket controls
|
||||
* action-button styling.
|
||||
*/
|
||||
final class HelpdeskCreateTicketEditorBrowserTest extends DuskTestCase
|
||||
{
|
||||
use BuildsHelpdeskFixtures;
|
||||
|
||||
/**
|
||||
* Ensure the create-ticket editor keeps toolbar controls, contenteditable spellcheck,
|
||||
* and compact footer buttons aligned with the Ticket controls styling baseline.
|
||||
*/
|
||||
public function test_create_ticket_editor_toolbar_spellcheck_and_action_buttons_are_rendered_correctly(): void
|
||||
{
|
||||
$this->seedLookupData();
|
||||
|
||||
$user = $this->user([
|
||||
'name' => 'Create Ticket Editor Regression User',
|
||||
]);
|
||||
|
||||
$this->browse(function (Browser $browser) use ($user): void {
|
||||
$browser->loginAs($user)
|
||||
->visitRoute('helpdesk.tickets.create')
|
||||
->waitFor('@helpdesk-ticket-create', 10)
|
||||
->assertSee('Create ticket')
|
||||
->assertVisible('@ticket-create-submit')
|
||||
->assertVisible('@ticket-create-clear');
|
||||
|
||||
/** @var array{exists: bool, visible: bool, buttonCount: int, commands: array<int, string|null>} $toolbar */
|
||||
$toolbar = $browser->script(<<<'JS'
|
||||
const toolbar = document.querySelector('[data-helpdesk-editor-toolbar]');
|
||||
const buttons = toolbar ? Array.from(toolbar.querySelectorAll('button[data-helpdesk-editor-command]')) : [];
|
||||
|
||||
return {
|
||||
exists: Boolean(toolbar),
|
||||
visible: Boolean(toolbar && toolbar.offsetParent !== null),
|
||||
buttonCount: buttons.length,
|
||||
commands: buttons.map((button) => button.getAttribute('data-helpdesk-editor-command')),
|
||||
};
|
||||
JS)[0];
|
||||
|
||||
$this->assertTrue($toolbar['exists'], 'The create-ticket editor toolbar was not rendered.');
|
||||
$this->assertTrue($toolbar['visible'], 'The create-ticket editor toolbar was rendered but is not visible.');
|
||||
$this->assertGreaterThanOrEqual(4, $toolbar['buttonCount'], 'The create-ticket editor toolbar should expose formatting buttons.');
|
||||
$this->assertContains('bold', $toolbar['commands'], 'The create-ticket editor toolbar is missing the bold button.');
|
||||
$this->assertContains('italic', $toolbar['commands'], 'The create-ticket editor toolbar is missing the italic button.');
|
||||
|
||||
/** @var array{exists: bool, isContentEditable: bool, contenteditable: string|null, spellcheck: string|null, lang: string|null} $editor */
|
||||
$editor = $browser->script(<<<'JS'
|
||||
const root = document.querySelector('[dusk="ticket-body-editor"], [data-dusk="ticket-body-editor"]');
|
||||
const editor = root && root.matches('[contenteditable="true"]')
|
||||
? root
|
||||
: root?.querySelector('[contenteditable="true"]');
|
||||
|
||||
return {
|
||||
exists: Boolean(editor),
|
||||
isContentEditable: Boolean(editor?.isContentEditable),
|
||||
contenteditable: editor?.getAttribute('contenteditable') || null,
|
||||
spellcheck: editor?.getAttribute('spellcheck') || null,
|
||||
lang: editor?.getAttribute('lang') || null,
|
||||
};
|
||||
JS)[0];
|
||||
|
||||
$this->assertTrue($editor['exists'], 'The create-ticket editor contenteditable surface was not rendered.');
|
||||
$this->assertTrue($editor['isContentEditable'], 'The create-ticket editor must use a native contenteditable surface.');
|
||||
$this->assertSame('true', $editor['contenteditable'], 'The create-ticket editor must keep contenteditable="true".');
|
||||
$this->assertSame('true', $editor['spellcheck'], 'The create-ticket editor must keep browser spellcheck enabled.');
|
||||
$this->assertSame('en-GB', $editor['lang'], 'The create-ticket editor must use British English spellcheck language.');
|
||||
|
||||
/** @var array{create: array<int, string>, clear: array<int, string>, cancel: array<int, string>} $classes */
|
||||
$classes = $browser->script(<<<'JS'
|
||||
const classList = (selector) => Array.from(document.querySelector(selector)?.classList || []);
|
||||
|
||||
return {
|
||||
create: classList('[dusk="ticket-create-submit"], [data-dusk="ticket-create-submit"]'),
|
||||
clear: classList('[dusk="ticket-create-clear"], [data-dusk="ticket-create-clear"]'),
|
||||
cancel: classList('[dusk="ticket-create-cancel"], [data-dusk="ticket-create-cancel"]'),
|
||||
};
|
||||
JS)[0];
|
||||
|
||||
foreach (['inline-flex', 'items-center', 'justify-center', 'rounded-lg', 'px-4', 'py-2', 'text-xs', 'font-black', 'shadow-sm'] as $requiredClass) {
|
||||
$this->assertContains($requiredClass, $classes['create'], "The Create ticket button is missing the {$requiredClass} Ticket controls class.");
|
||||
}
|
||||
|
||||
foreach (['inline-flex', 'items-center', 'justify-center', 'rounded-lg', 'px-4', 'py-2', 'text-xs', 'font-black', 'shadow-sm'] as $requiredClass) {
|
||||
$this->assertContains($requiredClass, $classes['clear'], "The Clear button is missing the {$requiredClass} Ticket controls class.");
|
||||
}
|
||||
|
||||
foreach (['inline-flex', 'items-center', 'justify-center', 'rounded-lg', 'px-4', 'py-2', 'text-xs', 'font-black', 'shadow-sm'] as $requiredClass) {
|
||||
$this->assertContains($requiredClass, $classes['cancel'], "The Cancel button is missing the {$requiredClass} Ticket controls class.");
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user