Rename events (#120)

josefarias · Mar 22, 2024 · 38d0d86 · 38d0d86
1 parent cf38af8
commit 38d0d86
Show file tree

Hide file tree

Showing 7 changed files with 57 additions and 54 deletions.
diff --git a/app/assets/javascripts/hw_combobox/models/combobox/events.js b/app/assets/javascripts/hw_combobox/models/combobox/events.js
@@ -2,17 +2,17 @@ import Combobox from "hw_combobox/models/combobox/base"
 import { dispatch } from "hw_combobox/helpers"
 
 Combobox.Events = Base => class extends Base {
-  _dispatchSelectionEvent({ isNewAndAllowed, previousValue }) {
+  _dispatchPreselectionEvent({ isNewAndAllowed, previousValue }) {
     if (previousValue === this._incomingFieldValueString) return
 
-    dispatch("hw-combobox:selection", { // TODO: rename to preselection
+    dispatch("hw-combobox:preselection", {
       target: this.element,
       detail: { ...this._eventableDetails, isNewAndAllowed, previousValue }
     })
   }
 
-  _dispatchClosedEvent() {
-    dispatch("hw-combobox:closed", { // TODO: rename to selection
+  _dispatchSelectionEvent() {
+    dispatch("hw-combobox:selection", {
       target: this.element,
       detail: this._eventableDetails
     })

diff --git a/app/assets/javascripts/hw_combobox/models/combobox/selection.js b/app/assets/javascripts/hw_combobox/models/combobox/selection.js
@@ -46,7 +46,7 @@ Combobox.Selection = Base => class extends Base {
     this._fieldValue = option.dataset.value
     this._markSelected(option)
     this._markValid()
-    this._dispatchSelectionEvent({ isNewAndAllowed: false, previousValue: previousValue })
+    this._dispatchPreselectionEvent({ isNewAndAllowed: false, previousValue: previousValue })
 
     option.scrollIntoView({ block: "nearest" })
   }
@@ -58,7 +58,7 @@ Combobox.Selection = Base => class extends Base {
     this._fieldValue = this._fullQuery
     this._fieldName = this.nameWhenNewValue
     this._markValid()
-    this._dispatchSelectionEvent({ isNewAndAllowed: true, previousValue: previousValue })
+    this._dispatchPreselectionEvent({ isNewAndAllowed: true, previousValue: previousValue })
   }
 
   _deselect() {
@@ -76,7 +76,7 @@ Combobox.Selection = Base => class extends Base {
 
   _deselectAndNotify() {
     const previousValue = this._deselect()
-    this._dispatchSelectionEvent({ isNewAndAllowed: false, previousValue: previousValue })
+    this._dispatchPreselectionEvent({ isNewAndAllowed: false, previousValue: previousValue })
   }
 
   _selectIndex(index) {

diff --git a/app/assets/javascripts/hw_combobox/models/combobox/toggle.js b/app/assets/javascripts/hw_combobox/models/combobox/toggle.js
@@ -23,7 +23,7 @@ Combobox.Toggle = Base => class extends Base {
 
       this.expandedValue = false
 
-      this._dispatchClosedEvent()
+      this._dispatchSelectionEvent()
 
       if (inputType != "hw:keyHandler:escape") {
         this._createChip(shouldReopen)

diff --git a/test/dummy/app/javascript/controllers/combobox/events_controller.js b/test/dummy/app/javascript/controllers/combobox/events_controller.js
@@ -1,10 +1,17 @@
 import { Controller } from "@hotwired/stimulus"
 
 export default class extends Controller {
-  static targets = [ "selectionScratchpad", "selectionCount", "closedScratchpad", "closedCount", "removalScratchpad", "removalCount" ]
+  static targets = [ "preselectionScratchpad", "preselectionCount", "selectionScratchpad", "selectionCount", "removalScratchpad", "removalCount" ]
 
   connect() {
-    this.selectionScratchpadTarget.innerText = "Ready to listen for hw-combobox events!"
+    this.preselectionScratchpadTarget.innerText = "Ready to listen for hw-combobox events!"
+  }
+
+  showPreselection(event) {
+    this.preselectionCount ??= 0
+    this.preselectionCount++
+    this.preselectionScratchpadTarget.innerText = this.#template(event)
+    this.preselectionCountTarget.innerText = `preselections: ${this.preselectionCount}.`
   }
 
   showSelection(event) {
@@ -14,13 +21,6 @@ export default class extends Controller {
     this.selectionCountTarget.innerText = `selections: ${this.selectionCount}.`
   }
 
-  showClosed(event) {
-    this.closedCount ??= 0
-    this.closedCount++
-    this.closedScratchpadTarget.innerText = this.#template(event)
-    this.closedCountTarget.innerText = `closings: ${this.closedCount}.`
-  }
-
   showRemoval(event) {
     this.removalCount ??= 0
     this.removalCount++

diff --git a/test/dummy/app/views/comboboxes/custom_events.html.erb b/test/dummy/app/views/comboboxes/custom_events.html.erb
@@ -4,17 +4,17 @@
 
 <div data-controller="combobox--events" style="display: flex; flex-direction: column; align-items: start; gap: 1rem;">
   <div style="display: flex; align-items: start; gap: 1rem;">
+    <span data-combobox--events-target="preselectionScratchpad"></span>
     <span data-combobox--events-target="selectionScratchpad"></span>
-    <span data-combobox--events-target="closedScratchpad"></span>
   </div>
 
   <div style="display: flex; align-items: start; gap: 1rem;">
+    <div data-combobox--events-target="preselectionCount"></div>
     <div data-combobox--events-target="selectionCount"></div>
-    <div data-combobox--events-target="closedCount"></div>
   </div>
 
   <div style="display: flex; align-items: start; gap: 1rem;">
-    <%= combobox_tag :movie, movies_path, id: "allow-new", placeholder: "allow-new", name_when_new: :new_movie, data: { action: "hw-combobox:selection->combobox--events#showSelection hw-combobox:closed->combobox--events#showClosed" } %>
-    <%= combobox_tag :movie, movies_path, id: "required", placeholder: "required", required: true, data: { action: "hw-combobox:selection->combobox--events#showSelection hw-combobox:closed->combobox--events#showClosed" } %>
+    <%= combobox_tag :movie, movies_path, id: "allow-new", placeholder: "allow-new", name_when_new: :new_movie, data: { action: "hw-combobox:preselection->combobox--events#showPreselection hw-combobox:selection->combobox--events#showSelection" } %>
+    <%= combobox_tag :movie, movies_path, id: "required", placeholder: "required", required: true, data: { action: "hw-combobox:preselection->combobox--events#showPreselection hw-combobox:selection->combobox--events#showSelection" } %>
   </div>
 </div>
diff --git a/test/dummy/app/views/comboboxes/multiselect_custom_events.html.erb b/test/dummy/app/views/comboboxes/multiselect_custom_events.html.erb
@@ -4,14 +4,14 @@
 
 <div data-controller="combobox--events" style="display: flex; flex-direction: column; align-items: start; gap: 1rem;">
   <div style="display: flex; align-items: start; gap: 1rem;">
+    <span data-combobox--events-target="preselectionScratchpad"></span>
     <span data-combobox--events-target="selectionScratchpad"></span>
-    <span data-combobox--events-target="closedScratchpad"></span>
     <span data-combobox--events-target="removalScratchpad"></span>
   </div>
 
   <div style="display: flex; align-items: start; gap: 1rem;">
+    <div data-combobox--events-target="preselectionCount"></div>
     <div data-combobox--events-target="selectionCount"></div>
-    <div data-combobox--events-target="closedCount"></div>
     <div data-combobox--events-target="removalCount"></div>
   </div>
 
@@ -21,7 +21,7 @@
           label: "States",
           multiselect_chip_src: new_state_chip_path,
           placeholder: "Select states",
-          data: { action: "hw-combobox:selection->combobox--events#showSelection hw-combobox:closed->combobox--events#showClosed hw-combobox:removal->combobox--events#showRemoval" } %>
+          data: { action: "hw-combobox:preselection->combobox--events#showPreselection hw-combobox:selection->combobox--events#showSelection hw-combobox:removal->combobox--events#showRemoval" } %>
   </div>
 </div>
 
diff --git a/test/system/hotwire_combobox_test.rb b/test/system/hotwire_combobox_test.rb
@@ -631,13 +631,13 @@ class HotwireComboboxTest < ApplicationSystemTestCase
 
     assert_text "Ready to listen for hw-combobox events!"
 
-    assert_no_text "selections:"
+    assert_no_text "preselections:"
 
     open_combobox "#allow-new"
     type_in_combobox "#allow-new", "A Bea"
 
-    assert_text "selections: 1."
-    assert_text "event: hw-combobox:selection"
+    assert_text "preselections: 1."
+    assert_text "event: hw-combobox:preselection"
     assert_text "value: #{movies(:a_beautiful_mind).id}"
     assert_text "display: A Beautiful Mind"
     assert_text "query: A Bea"
@@ -646,12 +646,12 @@ class HotwireComboboxTest < ApplicationSystemTestCase
     assert_text "isValid: true"
     assert_text "previousValue: <empty>"
 
-    assert_no_text "event: hw-combobox:closed"
+    assert_no_text "event: hw-combobox:selection"
 
     type_in_combobox "#allow-new", "t"
 
-    assert_text "selections: 2."
-    assert_text "event: hw-combobox:selection"
+    assert_text "preselections: 2."
+    assert_text "event: hw-combobox:preselection"
     assert_text "value: A Beat"
     assert_text "display: A Beat"
     assert_text "query: A Beat"
@@ -660,13 +660,12 @@ class HotwireComboboxTest < ApplicationSystemTestCase
     assert_text "isValid: true"
     assert_text "previousValue: #{movies(:a_beautiful_mind).id}"
 
-    assert_no_text "closings:"
-    assert_no_text "event: hw-combobox:closed"
+    assert_no_text "event: hw-combobox:selection"
 
     click_away
 
-    assert_text "closings: 1."
-    assert_text "event: hw-combobox:closed"
+    assert_text "selections: 1."
+    assert_text "event: hw-combobox:selection"
     assert_text "value: A Beat"
     assert_text "display: A Beat"
     assert_text "query: A Beat"
@@ -677,8 +676,8 @@ class HotwireComboboxTest < ApplicationSystemTestCase
     open_combobox "#required"
     type_in_combobox "#required", "A Bea"
 
-    assert_text "selections: 3."
-    assert_text "event: hw-combobox:selection"
+    assert_text "preselections: 3."
+    assert_text "event: hw-combobox:preselection"
     assert_text "value: #{movies(:a_beautiful_mind).id}"
     assert_text "display: A Beautiful Mind"
     assert_text "query: A Bea"
@@ -689,8 +688,8 @@ class HotwireComboboxTest < ApplicationSystemTestCase
 
     type_in_combobox "#required", "t"
 
-    assert_text "selections: 4."
-    assert_text "event: hw-combobox:selection"
+    assert_text "preselections: 4."
+    assert_text "event: hw-combobox:preselection"
     assert_text "value: <empty>"
     assert_text "display: A Beat"
     assert_text "query: A Beat"
@@ -701,8 +700,8 @@ class HotwireComboboxTest < ApplicationSystemTestCase
 
     click_away
 
-    assert_text "closings: 2."
-    assert_text "event: hw-combobox:closed"
+    assert_text "selections: 2."
+    assert_text "event: hw-combobox:selection"
     assert_text "value: <empty>"
     assert_text "display: A Beat"
     assert_text "query: A Beat"
@@ -717,8 +716,8 @@ class HotwireComboboxTest < ApplicationSystemTestCase
     click_on_option "The Godfather Part III"
 
     assert_text "previousValue: #{movies(:the_godfather_part_ii).id}"
-    assert_text "selections: 6."
-    assert_text "closings: 4."
+    assert_text "preselections: 6."
+    assert_text "selections: 4."
   end
 
   test "customized elements" do
@@ -952,38 +951,38 @@ class HotwireComboboxTest < ApplicationSystemTestCase
     visit multiselect_custom_events_path
 
     assert_text "Ready to listen for hw-combobox events!"
+    assert_no_text "event: hw-combobox:preselection"
     assert_no_text "event: hw-combobox:selection"
-    assert_no_text "event: hw-combobox:closed"
-    assert_no_text "selections:"
+    assert_no_text "preselections:"
 
     open_combobox "#states-field"
     type_in_combobox "#states-field", "mi"
 
-    assert_text "event: hw-combobox:selection"
+    assert_text "event: hw-combobox:preselection"
     assert_text "value: #{states(:michigan).id}."
     assert_text "display: Michigan"
     assert_text "query: Mi"
     assert_text "fieldName: states"
     assert_text "isNewAndAllowed: false"
     assert_text "isValid: true"
     assert_text "previousValue: <empty>"
-    assert_text "selections: 2." # `m`, then `mi`
-    assert_no_text "event: hw-combobox:closed"
+    assert_text "preselections: 2." # `m`, then `mi`
+    assert_no_text "event: hw-combobox:selection"
 
     click_away
     assert_closed_combobox
 
-    assert_text "event: hw-combobox:closed"
+    assert_text "event: hw-combobox:selection"
     assert_text "value: #{states(:michigan).id}."
     assert_text "display: Michigan"
     assert_text "query: Michigan"
     assert_text "fieldName: states"
     assert_text "isNewAndAllowed: <empty>"
     assert_text "isValid: true"
     assert_text "previousValue: <empty>"
-    assert_text "closings: 1."
+    assert_text "selections: 1."
 
-    assert_text "selections: 3."
+    assert_text "preselections: 3."
 
     remove_chip "Michigan"
     assert_open_combobox
@@ -995,7 +994,7 @@ class HotwireComboboxTest < ApplicationSystemTestCase
     click_on_option "Arkansas"
     click_on_option "Colorado"
 
-    assert_text "event: hw-combobox:selection"
+    assert_text "event: hw-combobox:preselection"
     assert_text "value: #{states(:arkansas, :colorado).pluck(:id).join(",")}."
     assert_text "display: Colorado."
     assert_text "query: Colorado."
@@ -1006,7 +1005,7 @@ class HotwireComboboxTest < ApplicationSystemTestCase
     assert_text "removedDisplay: <empty>."
     assert_text "removedValue: <empty>."
 
-    assert_text "event: hw-combobox:closed"
+    assert_text "event: hw-combobox:selection"
     assert_text "value: #{states(:arkansas, :colorado).pluck(:id).join(",")}."
     assert_text "display: Colorado."
     assert_text "query: Colorado."
@@ -1019,8 +1018,8 @@ class HotwireComboboxTest < ApplicationSystemTestCase
 
     click_away
 
-    assert_text "selections: 7." # TODO: lockInSelection causes duplicate selection events; shouldn't lock-in unnecessarily
-    assert_text "closings: 4."
+    assert_text "preselections: 7." # TODO: lockInSelection causes duplicate selection events; shouldn't lock-in unnecessarily
+    assert_text "selections: 4."
   end
 
   test "navigating chips with keyboard" do
@@ -1061,6 +1060,7 @@ class HotwireComboboxTest < ApplicationSystemTestCase
       [ states(:alabama).id ]
 
     type_in_combobox "#states-field", "New,place", :enter # comma is stripped away
+    assert_chip_with text: "Newplace"
     click_away
 
     assert_combobox_display_and_value \
@@ -1260,6 +1260,7 @@ def on_slow_device(delay:)
 
     def tab_away
       find("body").send_keys(:tab, :tab)
+      assert_closed_combobox
     end
 
     def click_away
@@ -1268,6 +1269,8 @@ def click_away
       else
         find("#clickable").click
       end
+
+      assert_closed_combobox
     end
 
     def click_on_top_left_corner