Livewire dispatch and listen in JS

class Counter extends Component
{

    public $count = 1;
 
    public function increment()
    {
        $this->count++;
        $this->dispatch('increment'); 
    }
 
    #[On('decrement')] 
    public function decrement()
    {
        dd("sss");
        $this->count--;
    }

    public function render()
    {
        return view('livewire.counter');
    }
}

   <h1>{{ $count }}</h1>

    <button wire:click="increment">+</button>

    <button wire:click="decrement">-</button>
    
    @script
    <script>
        // Listen for events dispatched from Livewire components in controller...
        $wire.$on('increment', (dataPassFromController) => {
            let components = Livewire.all()
            console.log("listen1", components)
            $wire.$dispatch('decrement');
        });

        // Listen for events dispatched from Livewire components directly in browser
        document.querySelector('button[wire\\:click="increment"]').addEventListener('click', (e) => {

             let components = Livewire.all()
            console.log("listen2", components[0].$wire.$get('count'))
        })
    </script>
    @endscript

  <script>
        document.addEventListener('livewire:initialized', () => {

            // Dispatch an event to any Livewire components listening...
            Livewire.dispatch('post-created', {
                postId: 2
            })

            // Dispatch an event to a given Livewire component by name...
            Livewire.dispatchTo('dashboard', 'post-created', {
                postId: 2
            })

            // Listen for events dispatched from Livewire components...
            Livewire.on('increment', (dataPassFromController) => {
                let components = Livewire.all()
                console.log("listen3", components)
            })



        })

        // Listen for events dispatched from Livewire components directly in browser...
        document.querySelector('button[wire\\:click="increment"]').addEventListener('click', (e) => {
            console.log("listen4")
        })
    </script>