@stackoverflow/stacks 1.10.1 → 1.10.2

package/lib/components/toggle-switch/toggle-switch.visual.test.ts

@@ -0,0 +1,73 @@
+import { html } from "@open-wc/testing";
+import { defaultOptions, runComponentTests } from "../../test/test-utils";
+import "../../index";
+
+describe("toggle-switch", () => {
+    // Single toggle switch
+    [true, false].forEach((checked) => {
+        [true, false].forEach((disabled) => {
+            const idSuffix = `${checked ? "-checked" : ""}${
+                disabled ? "-disabled" : ""
+            }`;
+            const id = `toggle-switch${idSuffix}`;
+
+            runComponentTests({
+                type: "visual",
+                baseClass: "s-toggle-switch",
+                modifiers: {
+                    global: idSuffix ? [idSuffix.substring(1)] : [], // for proper testid generation
+                },
+                tag: "input",
+                attributes: {
+                    id,
+                    type: "checkbox",
+                    ...(checked ? { checked: "" } : {}),
+                    ...(disabled ? { disabled: "" } : {}),
+                },
+                template: ({ component, testid }) => html`
+                    <div data-testid="${testid}" class="p4 ws1">
+                        <label class="v-visible-sr" for="${id}">toggle</label>
+                        ${component}
+                    </div>
+                `,
+            });
+        });
+    });
+
+    // Multiple toggle switch variant
+    [true, false].forEach((offChecked) => {
+        runComponentTests({
+            type: "visual",
+            baseClass: "s-toggle-switch",
+            variants: ["multiple"],
+            modifiers: {
+                global: offChecked ? ["off"] : [], // for proper testid generation
+            },
+            children: {
+                default: `
+                    <input type="radio" name="group" id="four" ${
+                        offChecked ? 'checked=""' : ""
+                    }>
+                    <label for="four" class="s-toggle-switch--label-off">Off</label>
+                    <input type="radio" name="group" id="one" ${
+                        !offChecked ? 'checked=""' : ""
+                    }>
+                    <label for="one">Weekly</label>
+                    <input type="radio" name="group" id="two">
+                    <label for="two">Daily</label>
+                    <input type="radio" name="group" id="three">
+                    <label for="three">3 hrs</label>
+                `,
+            },
+            options: {
+                ...defaultOptions,
+                includeNullVariant: false,
+            },
+            template: ({ component, testid }) => html`
+                <div data-testid="${testid}" class="d-flex ai-center g8 p4 ws2">
+                    ${component}
+                </div>
+            `,
+        });
+    });
+});

package/lib/components/uploader/uploader.ts

@@ -136,6 +136,7 @@ export class UploaderController extends Stacks.StacksController {
 
         if (file.type.match("image/*") && file.data) {
             thumbElement = document.createElement("img");
+            // eslint-disable-next-line @typescript-eslint/no-base-to-string
             thumbElement.src = file.data.toString();
             thumbElement.alt = file.name;
         } else {

package/package.json

@@ -5,7 +5,7 @@
         "type": "git",
         "url": "https://github.com/StackExchange/Stacks.git"
     },
-    "version": "1.10.1",
+    "version": "1.10.2",
     "files": [
         "dist",
         "lib"
@@ -46,17 +46,17 @@
         "@open-wc/testing": "^3.2.0",
         "@rollup/plugin-commonjs": "^25.0.3",
         "@rollup/plugin-replace": "^5.0.2",
-        "@stackoverflow/stacks-editor": "^0.8.7",
+        "@stackoverflow/stacks-editor": "^0.8.8",
         "@stackoverflow/stacks-icons": "^5.4.0",
         "@testing-library/dom": "^9.3.1",
         "@testing-library/user-event": "^14.4.3",
-        "@typescript-eslint/eslint-plugin": "^5.60.1",
-        "@typescript-eslint/parser": "^5.61.0",
+        "@typescript-eslint/eslint-plugin": "^6.2.1",
+        "@typescript-eslint/parser": "^6.2.1",
         "@web/dev-server-esbuild": "^0.4.1",
-        "@web/dev-server-rollup": "^0.4.0",
-        "@web/test-runner": "^0.16.1",
+        "@web/dev-server-rollup": "^0.5.2",
+        "@web/test-runner": "^0.17.0",
         "@web/test-runner-playwright": "^0.10.1",
-        "@web/test-runner-visual-regression": "^0.8.0",
+        "@web/test-runner-visual-regression": "^0.8.2",
         "concurrently": "^8.2.0",
         "css-loader": "^6.8.1",
         "cssnano": "^6.0.1",
@@ -64,7 +64,7 @@
         "eleventy-plugin-highlightjs": "^1.1.0",
         "eleventy-plugin-nesting-toc": "^1.3.0",
         "eslint": "^8.45.0",
-        "eslint-config-prettier": "^8.8.0",
+        "eslint-config-prettier": "^8.9.0",
         "eslint-plugin-no-unsanitized": "^4.0.2",
         "jquery": "^3.7.0",
         "less-loader": "^11.1.3",
@@ -75,13 +75,13 @@
         "postcss-loader": "^7.3.3",
         "prettier": "^3.0.0",
         "rollup-plugin-postcss": "^4.0.2",
-        "stylelint": "^15.10.1",
-        "stylelint-config-recommended": "^12.0.0",
+        "stylelint": "^15.10.2",
+        "stylelint-config-recommended": "^13.0.0",
         "stylelint-config-standard": "^34.0.0",
         "terser-webpack-plugin": "^5.3.9",
-        "ts-loader": "^9.4.3",
+        "ts-loader": "^9.4.4",
         "typescript": "^5.1.6",
-        "webpack": "^5.88.1",
+        "webpack": "^5.88.2",
         "webpack-cli": "^5.1.4",
         "webpack-merge": "^5.9.0"
     },