Change "emit" to "dispatch"

danharrin · May 2, 2023 · 3ce1cae · 3ce1cae
1 parent 2064095
commit 3ce1cae
Show file tree

Hide file tree

Showing 29 changed files with 267 additions and 498 deletions.
diff --git a/dist/livewire.js b/dist/livewire.js
@@ -4080,14 +4080,14 @@ ${expression ? 'Expression: "' + expression + '"\n\n' : ""}`, el);
     return parent.$wire;
   });
   wireProperty("$on", (component) => (...params) => listen(component, ...params));
-  wireProperty("$emit", (component) => (...params) => emit(...params));
-  wireProperty("$emitUp", (component) => (...params) => emitUp(component.el, ...params));
-  wireProperty("$emitSelf", (component) => (...params) => emitSelf(component.id, ...params));
-  wireProperty("$emitTo", (component) => (...params) => emitTo(...params));
-  wireProperty("emit", (component) => (...params) => emit(...params));
-  wireProperty("emitUp", (component) => (...params) => emitUp(component.el, ...params));
-  wireProperty("emitSelf", (component) => (...params) => emitSelf(component.id, ...params));
-  wireProperty("emitTo", (component) => (...params) => emitTo(...params));
+  wireProperty("$dispatch", (component) => (...params) => dispatch3(...params));
+  wireProperty("$dispatchUp", (component) => (...params) => dispatchUp(component.el, ...params));
+  wireProperty("$dispatchSelf", (component) => (...params) => dispatchSelf(component.id, ...params));
+  wireProperty("$dispatchTo", (component) => (...params) => dispatchTo(...params));
+  wireProperty("dispatch", (component) => (...params) => dispatch3(...params));
+  wireProperty("dispatchUp", (component) => (...params) => dispatchUp(component.el, ...params));
+  wireProperty("dispatchSelf", (component) => (...params) => dispatchSelf(component.id, ...params));
+  wireProperty("dispatchTo", (component) => (...params) => dispatchTo(...params));
 
   // js/component.js
   var Component = class {
@@ -4162,7 +4162,7 @@ ${expression ? 'Expression: "' + expression + '"\n\n' : ""}`, el);
     return Object.values(components)[0].$wire;
   }
 
-  // js/features/supportDispatch.js
+  // js/features/supportEvents.js
   on("effects", (component, effects) => {
     let dispatches = effects.dispatches;
     if (!dispatches)
@@ -4183,26 +4183,26 @@ ${expression ? 'Expression: "' + expression + '"\n\n' : ""}`, el);
       return;
     listeners2.forEach((name) => {
       globalListeners.add(name, (...params) => {
-        component.$wire.call("__emit", name, ...params);
+        component.$wire.call("__dispatch", name, ...params);
       });
       queueMicrotask(() => {
         component.el.addEventListener("__lwevent:" + name, (e) => {
-          component.$wire.call("__emit", name, ...e.detail.params);
+          component.$wire.call("__dispatch", name, ...e.detail.params);
         });
       });
     });
   });
-  function emit(name, ...params) {
+  function dispatch3(name, ...params) {
     globalListeners.each(name, (i) => i(...params));
   }
-  function emitUp(el, name, ...params) {
+  function dispatchUp(el, name, ...params) {
     dispatch(el, "__lwevent:" + name, { params });
   }
-  function emitSelf(id, name, ...params) {
+  function dispatchSelf(id, name, ...params) {
     let component = findComponent(id);
     dispatch(component.el, "__lwevent:" + name, { params }, false);
   }
-  function emitTo(componentName, name, ...params) {
+  function dispatchTo(componentName, name, ...params) {
     let components2 = componentsByName(componentName);
     components2.forEach((component) => {
       dispatch(component.el, "__lwevent:" + name, { params }, false);
@@ -5818,12 +5818,12 @@ ${expression ? 'Expression: "' + expression + '"\n\n' : ""}`, el);
   // js/index.js
   var Livewire = {
     directive: directive2,
-    emitTo,
+    dispatchTo,
     start: start2,
     first,
     find,
     hook: on,
-    emit,
+    dispatch: dispatch3,
     on: on3
   };
   if (window.Livewire)

diff --git a/dist/livewire.min.js b/dist/livewire.min.js
diff --git a/dist/manifest.json b/dist/manifest.json
@@ -1,2 +1,2 @@
 
-{"/livewire.js":"df674b84"}
+{"/livewire.js":"4d6c4d0a"}
diff --git a/docs/upgrading.md b/docs/upgrading.md
@@ -24,6 +24,8 @@
 - Change `$this->emit()` and `$emit` to `$this->dispatch()` and `$dispatch()`
     - Same with `emitTo()`
 - Change `dispatchBrowserEvent()` to `dispatch()`
+- Remove the concept of "up"
+- "assertEmitted" -> "assertedDispatched"
 
 ## New component layout file default
 - Previous: `resources/views/layouts/app.blade.php` | New: `resources/views/components/layouts/app.blade.php`

diff --git a/js/$wire.js b/js/$wire.js
@@ -1,4 +1,4 @@
-import { emit, emitSelf, emitTo, emitUp, listen } from '@/features/supportDispatch'
+import { dispatch, dispatchSelf, dispatchTo, dispatchUp, listen } from '@/features/supportEvents'
 import { generateEntangleFunction } from '@/features/supportEntangle'
 import { closestComponent, findComponent } from '@/store'
 import { callMethod, requestCommit } from '@/request'
@@ -130,12 +130,12 @@ wireProperty('$parent', component => {
 
 wireProperty('$on', (component) => (...params) => listen(component, ...params))
 
-wireProperty('$emit', (component) => (...params) => emit(...params))
-wireProperty('$emitUp', (component) => (...params) => emitUp(component.el, ...params))
-wireProperty('$emitSelf', (component) => (...params) => emitSelf(component.id, ...params))
-wireProperty('$emitTo', (component) => (...params) => emitTo(...params))
+wireProperty('$dispatch', (component) => (...params) => dispatch(...params))
+wireProperty('$dispatchUp', (component) => (...params) => dispatchUp(component.el, ...params))
+wireProperty('$dispatchSelf', (component) => (...params) => dispatchSelf(component.id, ...params))
+wireProperty('$dispatchTo', (component) => (...params) => dispatchTo(...params))
 
-wireProperty('emit', (component) => (...params) => emit(...params))
-wireProperty('emitUp', (component) => (...params) => emitUp(component.el, ...params))
-wireProperty('emitSelf', (component) => (...params) => emitSelf(component.id, ...params))
-wireProperty('emitTo', (component) => (...params) => emitTo(...params))
+wireProperty('dispatch', (component) => (...params) => dispatch(...params))
+wireProperty('dispatchUp', (component) => (...params) => dispatchUp(component.el, ...params))
+wireProperty('dispatchSelf', (component) => (...params) => dispatchSelf(component.id, ...params))
+wireProperty('dispatchTo', (component) => (...params) => dispatchTo(...params))
diff --git a/js/features/index.js b/js/features/index.js
@@ -6,6 +6,6 @@ import './supportReactiveProps';
 import './supportFileUploads';
 import './supportQueryString';
 import './supportRedirects';
-import './supportDispatch';
 import './supportMorphDom';
 import './supportEntangle';
+import './supportEvents';
diff --git a/js/features/supportDispatch.js → js/features/supportEvents.js b/js/features/supportDispatch.js → js/features/supportEvents.js
@@ -1,6 +1,6 @@
 import { componentsByName, findComponent } from '../store'
 import { on as hook } from '@/events'
-import { Bag, dispatch } from '@/utils'
+import { Bag, dispatch as dispatchEvent } from '@/utils'
 import Alpine from 'alpinejs'
 
 hook('effects', (component, effects) => {
@@ -28,37 +28,37 @@ hook('effects', (component, effects, path) => {
 
     listeners.forEach(name => {
         globalListeners.add(name, (...params) => {
-            component.$wire.call('__emit', name, ...params)
+            component.$wire.call('__dispatch', name, ...params)
         })
 
         queueMicrotask(() => {
             component.el.addEventListener('__lwevent:'+name, (e) => {
-                component.$wire.call('__emit', name, ...e.detail.params)
+                component.$wire.call('__dispatch', name, ...e.detail.params)
             })
         })
     })
 })
 
-export function emit(name, ...params) {
+export function dispatch(name, ...params) {
     globalListeners.each(name, i => i(...params))
 }
 
-export function emitUp(el, name, ...params) {
+export function dispatchUp(el, name, ...params) {
     // todo: __lweevent? ew.
-    dispatch(el, '__lwevent:'+name, { params })
+    dispatchEvent(el, '__lwevent:'+name, { params })
 }
 
-export function emitSelf(id, name, ...params) {
+export function dispatchSelf(id, name, ...params) {
     let component = findComponent(id)
 
-    dispatch(component.el, '__lwevent:'+name, { params }, false)
+    dispatchEvent(component.el, '__lwevent:'+name, { params }, false)
 }
 
-export function emitTo(componentName, name, ...params) {
+export function dispatchTo(componentName, name, ...params) {
     let components = componentsByName(componentName)
 
     components.forEach(component => {
-        dispatch(component.el, '__lwevent:'+name, { params }, false)
+        dispatchEvent(component.el, '__lwevent:'+name, { params }, false)
     })
 }
 

diff --git a/js/index.js b/js/index.js
@@ -1,4 +1,4 @@
-import { emit, emitTo, on } from './features/supportDispatch'
+import { dispatch, dispatchTo, on } from './features/supportEvents'
 import { directive } from './directives'
 import { find, first } from './store'
 import { on as hook } from './events'
@@ -7,12 +7,12 @@ import Alpine from 'alpinejs'
 
 export let Livewire = {
     directive,
-    emitTo,
+    dispatchTo,
     start,
     first,
     find,
     hook,
-    emit,
+    dispatch,
     on,
 }
 

diff --git a/legacy_tests/Browser/Alpine/Dispatch/DispatchComponent.php b/legacy_tests/Browser/Alpine/Dispatch/DispatchComponent.php
@@ -0,0 +1,56 @@
+<?php
+
+namespace LegacyTests\Browser\Alpine\Dispatch;
+
+use Livewire\Component as BaseComponent;
+
+class DispatchComponent extends BaseComponent
+{
+    public $events = [
+        'dispatch' => false,
+        'dispatchUp' => false,
+        'dispatchTo' => false,
+        'dispatchSelf' => false,
+    ];
+
+    protected $listeners = ['dispatch' => 'dispatchHandler'];
+
+    public function dispatchHandler($eventName)
+    {
+        $this->events[$eventName] = true;
+    }
+
+    public function render()
+    {
+        return
+<<<'HTML'
+<div>
+    <div x-data>
+        <button dusk="dispatch" @click="$wire.dispatch('dispatch', 'dispatch')">Dispatch</button>
+
+        @if ($events['dispatch'])
+            Dispatch worked!
+        @endif
+    </div>
+
+    <div x-data>
+        <button dusk="dispatchSelf" @click="$wire.dispatchSelf('dispatch', 'dispatchSelf')">Dispatch Self</button>
+
+        @if ($events['dispatchSelf'])
+            Dispatch self worked!
+        @endif
+    </div>
+
+    @livewire(LegacyTests\Browser\Alpine\Dispatch\DispatchNestedComponent::class)
+
+    @if ($events['dispatchUp'])
+        Dispatch up worked!
+    @endif
+
+    @if ($events['dispatchTo'])
+        Dispatch to worked!
+    @endif
+</div>
+HTML;
+    }
+}
diff --git a/legacy_tests/Browser/Alpine/Dispatch/DispatchNestedComponent.php b/legacy_tests/Browser/Alpine/Dispatch/DispatchNestedComponent.php
@@ -0,0 +1,20 @@
+<?php
+
+namespace LegacyTests\Browser\Alpine\Dispatch;
+
+use Livewire\Component as BaseComponent;
+
+class DispatchNestedComponent extends BaseComponent
+{
+    public function render()
+    {
+        return
+<<<'HTML'
+<div>
+    <div x-data>
+        <button dusk="dispatchTo" @click="$wire.dispatchTo('parent', 'dispatch', 'dispatchTo')">Dispatch To</button>
+    </div>
+</div>
+HTML;
+    }
+}
diff --git a/legacy_tests/Browser/Alpine/Dispatch/Test.php b/legacy_tests/Browser/Alpine/Dispatch/Test.php
@@ -0,0 +1,31 @@
+<?php
+
+namespace LegacyTests\Browser\Alpine\Dispatch;
+
+use Livewire\Livewire;
+use LegacyTests\Browser\TestCase;
+
+class Test extends TestCase
+{
+    public function test_dollar_wire_dispatch_works()
+    {
+        $this->browse(function ($browser) {
+            $this->visitLivewireComponent($browser, ['parent' => DispatchComponent::class, 'child' => DispatchNestedComponent::class])
+                ->assertDontSee('dispatch worked')
+                ->waitForLivewire()
+                ->click('@dispatch')
+                ->assertSee('Dispatch worked')
+
+                ->assertDontSee('Dispatch self worked')
+                ->waitForLivewire()
+                ->click('@dispatchSelf')
+                ->assertSee('Dispatch self worked')
+
+                ->assertDontSee('Dispatch to worked')
+                ->waitForLivewire()
+                ->click('@dispatchTo')
+                ->assertSee('Dispatch to worked')
+            ;
+        });
+    }
+}
diff --git a/legacy_tests/Browser/Alpine/Emit/EmitComponent.php b/legacy_tests/Browser/Alpine/Emit/EmitComponent.php
diff --git a/legacy_tests/Browser/Alpine/Emit/EmitNestedComponent.php b/legacy_tests/Browser/Alpine/Emit/EmitNestedComponent.php
Original file line number	Diff line number	Diff line change
		@@ -1,2 +1,2 @@

		{"/livewire.js":"df674b84"}
		{"/livewire.js":"4d6c4d0a"}