Fix error introduced with #212 patch follow up

garronej · Apr 30, 2024 · f4ef236 · f4ef236
1 parent 4691ba9
commit f4ef236
Showing 1 changed file with 47 additions and 25 deletions.
diff --git a/src/tss.ts b/src/tss.ts
@@ -135,14 +135,6 @@ export namespace Tss {
     };
 }
 
-let counter = 0;
-
-const nestedSelectorUsageTrackRecord: {
-    name: string | undefined;
-    idOfUseStyles: string;
-    nestedSelectorRuleNames: Set<string>;
-}[] = [];
-
 export function createTss<
     Context extends Record<string, unknown>,
     PluginParams extends Record<string, unknown>
@@ -186,6 +178,13 @@ export function createTss<
     return { tss };
 }
 
+let counter = 0;
+
+const nestedSelectorUsageTrackRecord: {
+    name: string;
+    nestedSelectorRuleNames: Set<string>;
+}[] = [];
+
 function createTss_internal<
     Context extends Record<string, unknown>,
     Params extends Record<string, unknown>,
@@ -240,6 +239,25 @@ function createTss_internal<
             // Do not attempt to 'simplify' the code without taking this fact into account.
             const idOfUseStyles = `x${counter++}`;
 
+            // NOTE: Cleanup for hot module reloading.
+            if (name !== undefined) {
+                // eslint-disable-next-line no-constant-condition
+                while (true) {
+                    const wrap = nestedSelectorUsageTrackRecord.find(
+                        wrap => wrap.name === name
+                    );
+
+                    if (wrap === undefined) {
+                        break;
+                    }
+
+                    nestedSelectorUsageTrackRecord.splice(
+                        nestedSelectorUsageTrackRecord.indexOf(wrap),
+                        1
+                    );
+                }
+            }
+
             const getCssObjectByRuleName =
                 typeof cssObjectByRuleNameOrGetCssObjectByRuleName ===
                 "function"
@@ -287,15 +305,33 @@ function createTss_internal<
                                                         assert(false);
                                                     }
 
-                                                    {
+                                                    if (
+                                                        isSSR &&
+                                                        name === undefined
+                                                    ) {
+                                                        throw new Error(
+                                                            [
+                                                                `tss-react: In SSR setups, in order to use nested selectors, you must also give a unique name to the useStyle function.`,
+                                                                `Solution: Use tss.withName("ComponentName").withNestedSelectors<...>()... to set a name.`
+                                                            ].join("\n")
+                                                        );
+                                                    }
+
+                                                    update_nested_selector_usage_track_record: {
+                                                        if (
+                                                            name === undefined
+                                                        ) {
+                                                            break update_nested_selector_usage_track_record;
+                                                        }
+
                                                         /* prettier-ignore */
-                                                        let wrap = nestedSelectorUsageTrackRecord.find(wrap => wrap.name === name && wrap.idOfUseStyles === idOfUseStyles);
+                                                        let wrap = nestedSelectorUsageTrackRecord.find(wrap => wrap.name === name);
 
                                                         /* prettier-ignore */
                                                         if (wrap === undefined) {
 
                                                             /* prettier-ignore */
-                                                            wrap = { name, idOfUseStyles, "nestedSelectorRuleNames": new Set() };
+                                                            wrap = { name, "nestedSelectorRuleNames": new Set() };
 
                                                             /* prettier-ignore */
                                                             nestedSelectorUsageTrackRecord.push(wrap);
@@ -305,18 +341,6 @@ function createTss_internal<
                                                         wrap.nestedSelectorRuleNames.add(ruleName);
                                                     }
 
-                                                    if (
-                                                        isSSR &&
-                                                        name === undefined
-                                                    ) {
-                                                        throw new Error(
-                                                            [
-                                                                `tss-react: In SSR setups, in order to use nested selectors, you must also give a unique name to the useStyle function.`,
-                                                                `Solution: Use tss.withName("ComponentName").withNestedSelectors<...>()... to set a name.`
-                                                            ].join("\n")
-                                                        );
-                                                    }
-
                                                     detect_potential_conflicts: {
                                                         if (
                                                             name === undefined
@@ -327,8 +351,6 @@ function createTss_internal<
                                                         const hasPotentialConflict =
                                                             nestedSelectorUsageTrackRecord.find(
                                                                 wrap =>
-                                                                    wrap.idOfUseStyles !==
-                                                                        idOfUseStyles &&
                                                                     wrap.name ===
                                                                         name &&
                                                                     wrap.nestedSelectorRuleNames.has(