HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
File: D:/HostingSpaces/blijegasten/blijegasten.be/tests/Browser/ComponentsBackendTest.php
<?php

namespace Tests\Browser;

use App\Komma\Components\Component\Component;
use App\Komma\Documents\Models\Document;
use App\Komma\Users\Models\KmsUser;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Str;
use Laravel\Dusk\Browser;
use Tests\Browser\Pages\PageSectionTestPage;
use Tests\DuskTestCase;

class ComponentsBackendTest extends DuskTestCase
{
    /**
     * @group ComponentsBackend
     * @test
     * @throws \Throwable
     */
    public function testImageComponent()
    {
        $testPageName = 'Dusk Test Page '.rand(10000, 99999);

        $this->browse((function (Browser $browser) use($testPageName) {
            $browser->loginAs(KmsUser::find(1), 'kms')
                ->visit(new PageSectionTestPage());

            //Create a page and open the English tab
            $browser->click('@add_button')
                ->type('@TextField-code_name', Str::slug($testPageName))
                ->click('@entity_tab_en');

            //Add a new image component
            $browser->pause(200);
            $browser->scrollToElement('[dusk="add_image_component_en"]'); //See extra dusk tools
            $browser->click('[dusk="add_image_component_en"]');
            $key = 'ComponentArea\\\\|dynamic_group_sections\\\\|C%d\\\\|image\\\\|en'; //The slashes escape the pipes. No idea why chrome requires two escaped slashes here.
            $alernativeKey = 'ComponentArea\|dynamic_group_sections\|C%d\|image\|en'; //The slashes escape the pipes.

            //Get the count of uploaded documents before we are going to upload. And get the latest id
            $countBeforeUpload = Document::count();
            echo 'Document count before upload ('.DB::getDatabaseName().'): '.$countBeforeUpload.PHP_EOL;
            $componentId = 0;

            //Upload picture in component
            $noChildElementCountScript = sprintf("document.querySelector('#".$key."-wrapper > ul').childElementCount == 0", $componentId);
            $oneChildElementCountScript = sprintf("document.querySelector('#".$key."-wrapper > ul').childElementCount == 1", $componentId);
            $uploadingStartedScript = sprintf("document.querySelector('#".$key."-wrapper > ul > li:nth-child(1) .thumb').classList.contains('is-uploading');", $componentId);
            $uploadingCompletedScript = sprintf("document.querySelector('#".$key."-wrapper > ul > li:nth-child(1) .thumb').classList.contains('is-uploading') == false;", $componentId);

            $browser->waitUntil($noChildElementCountScript, null, 'No images should be uploaded yet. Javascript expression: '.$noChildElementCountScript) //Make sure no image is uploaded yet
            ->attach(sprintf(''.$alernativeKey.'_file_catcher', $componentId), base_path('tests/Uploads/flower_image.jpg')) //Give the document uploader an image
            ->waitUntil($oneChildElementCountScript, null,'An image could not uploaded. Javascript expression: '.$oneChildElementCountScript) //One image should be getting uploaded (not yet uploaded completely).
            ->waitUntil($uploadingStartedScript, null, 'Uploading was not started. Javascript expression: '.$uploadingStartedScript) //Wait until the image is uploading
            ->waitUntil($uploadingCompletedScript, null, 'Uploading did not complete. Javascript expression: '.$uploadingCompletedScript); //Wait until the image is uploaded completely

            //Check that the document was uploaded and that it is referred to correctly in the database
            $countAfterUpload = Document::count();
            /** @var Document $latestDocumentAfterUpload */
            $latestDocumentAfterUpload = Document::latest()->first();
            $this->assertEquals($countBeforeUpload + 1, $countAfterUpload);
            $this->assertFileExists(public_path(substr($latestDocumentAfterUpload->file_system_path, 1)));
            $this->assertEquals(0, $latestDocumentAfterUpload->documentable_id); //This field will only contain a correct id after saving
            $this->assertEmpty($latestDocumentAfterUpload->documentable_type); //This field will only be filled after saving

            //Save the component. The documents documentable id and documentable type fields should now refer to the component
            $browser->click('@save_button');
            $latestDocumentAfterUpload->refresh();
            $this->assertEquals(Component::latest()->first()->id, $latestDocumentAfterUpload->documentable_id); //This field will only contain a correct id after saving
            $this->assertEquals(Component::class, $latestDocumentAfterUpload->documentable_type); //This field will only be filled after saving

            //Delete the image
            $latestComponentAfterUpload = Component::latest()->first();
            $documentMarkedAsDeletedScriptAfterUpload = sprintf("document.querySelector('#".$key."-wrapper ul > li:nth-child(1)').classList.contains('deleted');", $latestComponentAfterUpload->id);
            $noChildElementCountScriptAfterUpload = sprintf("document.querySelector('#".$key."-wrapper > ul').childElementCount == 0", $latestComponentAfterUpload->id);
            $browser->click(sprintf('#'.$alernativeKey.'-wrapper > ul > li:nth-child(1) .delete', $latestComponentAfterUpload->id))
                ->waitUntil($documentMarkedAsDeletedScriptAfterUpload, null, 'The document was not marked as deleted. Javascript expression: '.$documentMarkedAsDeletedScriptAfterUpload)
                ->click('@save_button')
                ->waitUntil($noChildElementCountScriptAfterUpload, null, 'The just deleted image was not deleted. Javascript expression: '.$noChildElementCountScriptAfterUpload); //Make the image is deleted

            $this->assertFileNotExists(public_path(substr($latestDocumentAfterUpload->file_system_path, 1)));
            $this->assertNull(Document::find($latestDocumentAfterUpload->id));
        })->bindTo($this));
    }
}