Fix overscroll mobile

app/javascript/controllers/duplicate_checker_controller.js

@@ -25,39 +25,51 @@ export default class extends Controller {
   connect() {
     const form = this.element
     this.hideRestOfForm()
+
     form.addEventListener('change', () =>  {
       this.checkDuplicates()
     });
 
     const titleField = form.querySelector("#space_title")
     titleField.addEventListener('input', (e) => {
-      if (e.target.value.length < 5) {
-        return
-      }
-
       this.checkDuplicates()
     })
   }
 
   async checkDuplicates() {
-    const data = new FormData(this.element);
-    const title = data.get("space[title]");
-    const address = data.get("space[address]");
-    const post_number = data.get("space[post_number]");
+    const {
+      title,
+      address,
+      post_number
+    } = this.extractDataFromForm()
 
-    const enoughDataToFindByTitle = title.length > 5
-    const enoughDataToFindByAddress = (!post_number || (!address && !post_number))
+    if (this.checkIfDataIsStale(title, address, post_number)) {
+      return // No need to check anything if we have the same data
+    }
 
-    if (!enoughDataToFindByTitle || !enoughDataToFindByAddress) return
+    const enoughDataToFindByTitle = title.length > 5
+    const enoughDataToFindByAddress = (!!address && !!post_number)
 
-    if (this.checkIfDataIsStale(title, address, post_number)) {
-      return
+    if (!enoughDataToFindByTitle && !enoughDataToFindByAddress) {
+      return this.renderNoDuplicates()
     }
 
+    return await this.renderFetchedDuplicates(title, address, post_number)
+  }
+
+  extractDataFromForm() {
+    const data = new FormData(this.element);
+    const title = data.get("space[title]");
+    const address = data.get("space[address]");
+    const post_number = data.get("space[post_number]");
+    return { title, address, post_number }
+  }
+
+  async renderFetchedDuplicates(title, address, post_number) {
     let url = "/check_duplicates?"
-        url += `title=${title}&`
-        url += `address=${address}&`
-        url += `post_number=${post_number}&`
+    url += `title=${title}&`
+    url += `address=${address}&`
+    url += `post_number=${post_number}&`
 
     const result = await (await fetch(url)).json()
     if (result && result.html) {
@@ -68,8 +80,16 @@ export default class extends Controller {
     return this.showRestOfForm()
   }
 
+  renderNoDuplicates() {
+    return this.duplicatesRenderHereTarget.innerHTML = ""
+  }
+
+
   checkIfDataIsStale(title, address, post_number) {
-    if (title !== this.state.title || address !== this.state.address || post_number !== this.state.post_number) {
+    if (
+      title !== this.state.title ||
+      address !== this.state.address ||
+      post_number !== this.state.post_number) {
       this.state.title = title
       this.state.address = address
       this.state.post_number = post_number

spec/features/user_manages_space_spec.rb

@@ -27,14 +27,14 @@
       fill_in "space_post_number", with: space.post_number
       find("body").click # Blur from field
 
-      expect(page).to have_content(I18n.t("space_create.any_of_these.one"))
+      expect(page).to have_content(I18n.t("space_create.any_of_these.one"), wait: 10)
 
       click_on I18n.t("space_create.none_are_duplicates.one")
 
       tom_select("select#space_space_type_ids", option_id: space_type.id)
       tom_select("select#space_space_group_title", option_id: space_group.title)
       click_on I18n.t("helpers.submit.create", model: Space.model_name.human)
-      expect(page).to have_content(space.title)
+      expect(page).to have_text(space.title)
     end
   end