[Autocomplete] clear tomselect instance to avoid double initialization #3155

daFish · 2025-10-31T15:24:49Z

Q	A
Bug fix?	yes
New feature?	no
Deprecations?	no
Documentation?	no
Issues	Fix #2623
License	MIT

Problem

When Autocomplete elements are removed and re-added to the DOM (e.g., with Turbo navigation), a race condition causes
"Tom Select already initialized on this element" error.

Root Cause

disconnect() destroys TomSelect but leaves this.tomSelect pointing to the destroyed instance. If urlValueChanged()
fires before connect() (during re-attachment), it calls resetTomSelect() on the stale reference, triggering
double-initialization.

Impact

Affects: Users with Turbo navigation, especially on mobile (Safari iOS)
Symptoms: "Tom Select already initialized" console errors during navigation
Fix: Single line addition prevents the race condition
Risk: None - only affects the disconnect cleanup path

github-actions · 2025-10-31T15:25:20Z

📊 Packages dist files size difference

Thanks for the PR! Here is the difference in size of the packages dist files between the base branch and the PR.
Please review the changes and make sure they are expected.

File	Before (Size / Gzip)	After (Size / Gzip)
Autocomplete
`controller.d.ts`	`1.95 kB` / `656 B`	`1.96 kB`^{+1% 📈} / `666 B`^{+2% 📈}
`controller.js`	`15.02 kB` / `3.88 kB`	`15.2 kB`^{+1% 📈} / `3.91 kB`^{+1% 📈}

daFish · 2025-11-01T11:02:05Z

@Kocal I took the chance to add playwright tests. I'll submit another PR with some changes to the documentation to enhance the DX.

src/Autocomplete/assets/test/browser/placeholder.test.ts

Kocal

Thanks Marcus, that's much appreciated!

I only have some comments about the E2E test, and of course any documentation improvement is welcomed :)

src/Autocomplete/assets/test/browser/placeholder.test.ts

daFish · 2025-11-03T06:47:16Z

removed the browser test because I couldn't find a way to reproduce it here
added a simple non-ajax example for Autocomplete

daFish · 2025-11-03T11:24:54Z

Ok, this is weird. I have force-pushed my changes this morning and the PR is still not updated. My changes are still being processed. 🤨

daFish · 2025-11-03T11:28:47Z

Rebased against 2.x and force-pushed again. Works now.

daFish · 2025-11-08T16:24:15Z

@Kocal After several attempts trying to reproduce the behaviour locally, I was unable to provoce it. How shall we move forward?

smnandre

A couple of comments passing by, thank you for the PR!

smnandre · 2025-11-15T03:23:08Z

apps/e2e/src/Form/Type/AutocompleteSelectType.php

@@ -0,0 +1,44 @@
+<?php
+
+declare(strict_types=1);


Suggested change

declare(strict_types=1);

smnandre · 2025-11-15T03:23:38Z

apps/e2e/src/Form/Type/AutocompleteSelectType.php

+
+class AutocompleteSelectType extends AbstractType
+{
+    public function buildForm(FormBuilderInterface $builder, array $options)


Suggested change

public function buildForm(FormBuilderInterface $builder, array $options)

public function buildForm(FormBuilderInterface $builder, array $options): void

smnandre · 2025-11-15T03:25:16Z

src/Autocomplete/assets/src/controller.ts

            // clear the text input after selecting a value
            onItemAdd: () => {
-                this.tomSelect.setTextboxValue('');
+                this.tomSelect?.setTextboxValue('');


This is not supposed to happen, is it ?

We can make it more defensive when something like this happens.

smnandre · 2025-11-15T03:25:26Z

src/Autocomplete/assets/src/controller.ts

+                if (!this.tomSelect) {
+                    return;
+                }


smnandre · 2025-11-15T03:25:57Z

src/Autocomplete/assets/src/controller.ts

            optgroupField: 'group_by',
            // avoid extra filtering after results are returned
-            score: (search: string) => (item: any) => 1,
+            score: (_search: string) => (_item: any) => 1,


why this change ? genuine question here

The underscore is used to indicate an unused variable while making the linter happy.

Was he unhappy ? never observed that .. but ok :)

🤷🏻‍♂️ It's not easy being a linter I guess.

smnandre · 2025-11-15T03:26:17Z

src/Autocomplete/assets/src/controller.ts

+        if (!this.tomSelect) {
+            return;
+        }
+


Same ting, not supposed to happen here

Will be reverted.

daFish · 2025-11-16T14:05:11Z

@smnandre The defensive checks can remain IHMO. We tell other developers that all code paths are safe. Yes, it should not happen but we make it explicit that it will not happen. Especially in the callbacks, e.g. onItemAdd or onOptionAdd. WDYT?

…ation

carsonbot added Bug Bug Fix Status: Needs Review Needs to be reviewed labels Oct 31, 2025

carsonbot changed the title ~~fix(autocomplete): clear tomselect instance to avoid double initialization~~ fix(autocomplete): clear tomselect instance to avoid double initialization Oct 31, 2025

daFish changed the title ~~fix(autocomplete): clear tomselect instance to avoid double initialization~~ [Autocomplete] clear tomselect instance to avoid double initialization Oct 31, 2025

daFish force-pushed the fix/autocomplete-tomselect-cleanup branch 2 times, most recently from 4cac269 to 10ac03b Compare October 31, 2025 18:51

daFish marked this pull request as draft October 31, 2025 18:51

daFish force-pushed the fix/autocomplete-tomselect-cleanup branch 3 times, most recently from 5e5a833 to 1a899ea Compare November 1, 2025 10:55

daFish marked this pull request as ready for review November 1, 2025 11:02

carsonbot added the Autocomplete label Nov 1, 2025

Kocal reviewed Nov 2, 2025

View reviewed changes

src/Autocomplete/assets/test/browser/placeholder.test.ts Show resolved Hide resolved

Kocal requested changes Nov 2, 2025

View reviewed changes

src/Autocomplete/assets/test/browser/placeholder.test.ts Show resolved Hide resolved

src/Autocomplete/assets/test/browser/placeholder.test.ts Outdated Show resolved Hide resolved

carsonbot added Status: Needs Work Additional work is needed and removed Status: Needs Review Needs to be reviewed labels Nov 2, 2025

daFish force-pushed the fix/autocomplete-tomselect-cleanup branch from 1a899ea to 2b36965 Compare November 3, 2025 06:46

carsonbot added Status: Needs Review Needs to be reviewed and removed Status: Needs Work Additional work is needed labels Nov 3, 2025

daFish force-pushed the fix/autocomplete-tomselect-cleanup branch from 893194e to 025ed56 Compare November 3, 2025 11:28

smnandre reviewed Nov 15, 2025

View reviewed changes

daFish force-pushed the fix/autocomplete-tomselect-cleanup branch from 025ed56 to f4bd90b Compare November 16, 2025 14:05

fix(autocomplete): clear tomselect instance to avoid double initializ…

12fac00

…ation

test(e2e): added example for non-ajax autocomplete field

60f3a9d

daFish force-pushed the fix/autocomplete-tomselect-cleanup branch from f4bd90b to 60f3a9d Compare November 16, 2025 14:07

	public function buildForm(FormBuilderInterface $builder, array $options)
	public function buildForm(FormBuilderInterface $builder, array $options): void

Uh oh!

[Autocomplete] clear tomselect instance to avoid double initialization #3155

Are you sure you want to change the base?

[Autocomplete] clear tomselect instance to avoid double initialization #3155

Uh oh!

Conversation

daFish commented Oct 31, 2025

Uh oh!

github-actions bot commented Oct 31, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

📊 Packages dist files size difference

Uh oh!

daFish commented Nov 1, 2025

Uh oh!

Uh oh!

Kocal left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

daFish commented Nov 3, 2025

Uh oh!

daFish commented Nov 3, 2025

Uh oh!

daFish commented Nov 3, 2025

Uh oh!

daFish commented Nov 8, 2025

Uh oh!

smnandre left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

daFish commented Nov 16, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

github-actions bot commented Oct 31, 2025 •

edited

Loading