{"id":21039229,"url":"https://github.com/benjaminboruff/wireloading","last_synced_at":"2025-03-13T21:17:54.426Z","repository":{"id":46629015,"uuid":"412945866","full_name":"benjaminboruff/wireloading","owner":"benjaminboruff","description":"Livewire syncInput weirdness possibly due to issue with wire:loading.class","archived":false,"fork":false,"pushed_at":"2021-10-03T20:26:27.000Z","size":352,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-01-20T16:41:42.799Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/benjaminboruff.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2021-10-03T01:04:35.000Z","updated_at":"2021-10-03T20:54:12.000Z","dependencies_parsed_at":"2022-09-07T19:12:27.288Z","dependency_job_id":null,"html_url":"https://github.com/benjaminboruff/wireloading","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/benjaminboruff%2Fwireloading","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/benjaminboruff%2Fwireloading/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/benjaminboruff%2Fwireloading/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/benjaminboruff%2Fwireloading/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/benjaminboruff","download_url":"https://codeload.github.com/benjaminboruff/wireloading/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":243482934,"owners_count":20297907,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-11-19T13:38:30.021Z","updated_at":"2025-03-13T21:17:54.404Z","avatar_url":"https://github.com/benjaminboruff.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"## wire:loading.class issue\n\nSomething odd is happening when using the `wire:loading` directive \nwith the `class` modifier. In this specific case, when\nused in a `@forelse` loop associated with a transaction search query in the `Dashboard` \nlivewire component, the `wire:loading.class=\"whatever\"` directive in the blade view causes non-stop `syncInput` \nrequests to fire in the browser when additional input is typed *after* the initial\nsearch finds no results. \n\nFor example (using my repo's simplified code based on Caleb's \nscreencast *Building Data Tables -\u003e Basic Search*), quickly type \nin a search string (*in this case, yourapp/dashboard*) that should produce \n`No transactions found...`. If you typed quickly enough, you should see the \nround-trip in the networking tab. Then type one or more additional letters\n... then *boom*, non-stop `syncInput` requests begin to fire.\n\nTo stop it you must backspace over the search string until some \nrecords are found. I've tried other `wire:loading` directives, but none\nbut the `class` modifier seem to trigger this behavior.\n\nI think Caleb also ran into this issue in the *Basic Search* video about time marker\n*9:48* when he says \"Oh, I have some loopty-dupe thing going on\". If you look in\nthe bottom left corner of his screen you will see the \"Waiting for surge.test...\" \nmessages flashing in the browser. That's when I think he hit the problem. I think\nrefreshing, then not triggering it again, may have stopped the issue during the remaining time\nof the video.\n\nI am using both Chrome and Firefox (latest) on linux, running laravel 8.62.0, php 8.0.11\nin Homestead 11.4.0, with livewire 2.6.7, and alpine 3.x.x (loaded in layouts.base).\n\nSo setup, copy the example .env file and add your DB stuff. \nThen migrate with seed (this gives you 250 transactions from the factory).\nThen go to your site's `dashboard` route, and quickly type in a bunch of \ngibberish. You should get `No transactions found...` in the table. \n\nThen type some\nadditional characters and look at your browser's networking tab in the\ndev tools. You should see a barrage of `syncInput` requests.\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbenjaminboruff%2Fwireloading","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbenjaminboruff%2Fwireloading","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbenjaminboruff%2Fwireloading/lists"}