<?php

namespace Tests\Browser\Layout;

use Laravel\Dusk\Browser;
use Tests\Browser\Concerns\InteractsWithWmsData;
use Tests\DuskTestCase;

class FixedSidebarMainScrollTest extends DuskTestCase
{
    use InteractsWithWmsData;

    /**
     * The document must not scroll; only the right-hand main content area may scroll.
     */
    public function test_document_does_not_scroll_when_main_content_scrolls(): void
    {
        $user = $this->tenantUser();
        $this->seedWarehouse($user->company);

        $this->browse(function (Browser $browser) use ($user): void {
            $browser
                ->loginAs($user)
                ->visit('/dashboard')
                ->waitFor('[data-test="desktop-sidebar"]', 10)
                ->waitFor('[data-test="main-content"]', 10);

            $browser->script(<<<'JS'
                const main = document.querySelector('[data-test="main-content"]');
                const filler = document.createElement('div');

                filler.setAttribute('data-test', 'scroll-filler');
                filler.style.height = '2600px';

                main.appendChild(filler);
                window.scrollTo(0, 800);
                document.documentElement.scrollTop = 800;
                document.body.scrollTop = 800;
                main.scrollTop = 900;
            JS);

            $documentScrollTop = $browser->script(
                'return Math.round(window.scrollY || document.documentElement.scrollTop || document.body.scrollTop || 0);'
            )[0];

            $mainScrollTop = $browser->script(
                'return Math.round(document.querySelector("[data-test=\\"main-content\\"]").scrollTop);'
            )[0];

            $sidebarTop = $browser->script(
                'return Math.round(document.querySelector("[data-test=\\"desktop-sidebar\\"]").getBoundingClientRect().top);'
            )[0];

            $this->assertSame(0, $documentScrollTop);
            $this->assertSame(0, $sidebarTop);
            $this->assertGreaterThan(0, $mainScrollTop);
        });
    }
}