From cf8d66678e5823a66fbd37db07b7e948d4403250 Mon Sep 17 00:00:00 2001 From: Theodore Brown Date: Tue, 24 Sep 2024 11:56:44 -0500 Subject: [PATCH] Update to ESLint 9 --- .eslintrc.cjs | 34 --------------------------- eslint.config.js | 32 +++++++++++++++++++++++++ package.json | 44 +++++++++++++++++------------------ src/lib/fa-layers-text.svelte | 13 ++++++++--- src/lib/fa-layers.svelte | 4 +++- src/lib/fa.svelte | 4 +++- test/basic.test.ts | 2 +- test/duotone.test.ts | 1 - 8 files changed, 71 insertions(+), 63 deletions(-) delete mode 100644 .eslintrc.cjs create mode 100644 eslint.config.js diff --git a/.eslintrc.cjs b/.eslintrc.cjs deleted file mode 100644 index bf45757..0000000 --- a/.eslintrc.cjs +++ /dev/null @@ -1,34 +0,0 @@ -/** @type { import("eslint").Linter.Config } */ -module.exports = { - root: true, - extends: [ - "eslint:recommended", - "plugin:@typescript-eslint/recommended", - "plugin:svelte/recommended", - "prettier", - ], - parser: "@typescript-eslint/parser", - plugins: ["@typescript-eslint"], - parserOptions: { - sourceType: "module", - ecmaVersion: 2020, - extraFileExtensions: [".svelte"], - }, - env: { - browser: true, - es2017: true, - node: true, - }, - overrides: [ - { - files: ["*.svelte"], - parser: "svelte-eslint-parser", - parserOptions: { - parser: "@typescript-eslint/parser", - }, - rules: { - "svelte/no-inline-styles": "error", - }, - }, - ], -}; diff --git a/eslint.config.js b/eslint.config.js new file mode 100644 index 0000000..4c52f61 --- /dev/null +++ b/eslint.config.js @@ -0,0 +1,32 @@ +import js from "@eslint/js"; +import ts from "typescript-eslint"; +import svelte from "eslint-plugin-svelte"; +import prettier from "eslint-config-prettier"; +import globals from "globals"; +/** @type {import('eslint').Linter.Config[]} */ +export default [ + js.configs.recommended, + ...ts.configs.recommended, + ...svelte.configs["flat/recommended"], + prettier, + ...svelte.configs["flat/prettier"], + { + languageOptions: { + globals: { + ...globals.browser, + ...globals.node, + }, + }, + }, + { + files: ["**/*.svelte"], + languageOptions: { + parserOptions: { + parser: ts.parser, + }, + }, + rules: { + "svelte/no-inline-styles": "error", + }, + }, +]; diff --git a/package.json b/package.json index 1a0661e..8f50561 100644 --- a/package.json +++ b/package.json @@ -31,7 +31,7 @@ "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json", "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch", "test": "vitest --typecheck --coverage.enabled", - "lint": "prettier --check . && eslint --ignore-path .gitignore .", + "lint": "prettier --check . && eslint src test", "format": "prettier --write ." }, "type": "module", @@ -55,29 +55,29 @@ }, "devDependencies": { "@cweili/fa-test-util": "^1.0.0", - "@sveltejs/adapter-static": "^3.0.1", - "@sveltejs/kit": "^2.0.6", - "@sveltejs/package": "^2.2.4", - "@sveltejs/vite-plugin-svelte": "^3.0.1", - "@testing-library/svelte": "^4.0.5", - "@typescript-eslint/eslint-plugin": "^6.15.0", - "@typescript-eslint/parser": "^6.15.0", - "@vitest/coverage-v8": "^1.1.0", + "@sveltejs/adapter-static": "^3.0.5", + "@sveltejs/kit": "^2.5.28", + "@sveltejs/package": "^2.3.5", + "@sveltejs/vite-plugin-svelte": "^3.1.2", + "@testing-library/svelte": "^5.2.1", + "@types/eslint": "^9.6.1", + "@vitest/coverage-v8": "^2.1.1", "bootstrap": "^5.3.2", - "eslint": "^8.56.0", + "eslint": "^9.11.0", "eslint-config-prettier": "^9.1.0", - "eslint-plugin-svelte": "^2.35.1", + "eslint-plugin-svelte": "^2.44.0", + "globals": "^15.9.0", "highlight.js": "^11.9.0", - "jsdom": "^23.0.1", - "prettier": "^3.1.1", - "prettier-plugin-svelte": "^3.1.2", - "publint": "^0.2.6", - "sass": "^1.69.5", - "svelte": "^4.2.8", - "svelte-check": "^3.6.2", - "tslib": "^2.6.2", - "typescript": "^5.3.3", - "vite": "^5.0.10", - "vitest": "^1.1.0" + "jsdom": "^25.0.1", + "prettier": "^3.3.3", + "prettier-plugin-svelte": "^3.2.6", + "publint": "^0.2.11", + "sass": "1.77.6", + "svelte": "^4.2.19", + "svelte-check": "^4.0.2", + "typescript": "5.5", + "typescript-eslint": "^8.6.0", + "vite": "^5.4.7", + "vitest": "^2.1.1" } } diff --git a/src/lib/fa-layers-text.svelte b/src/lib/fa-layers-text.svelte index 4e26fe6..d9f1204 100644 --- a/src/lib/fa-layers-text.svelte +++ b/src/lib/fa-layers-text.svelte @@ -16,10 +16,17 @@ export let flip: FlipDir | undefined = undefined; let containerElement: HTMLElement; - $: containerElement && size && setCustomFontSize(containerElement, size); - $: containerElement && color && (containerElement.style.color = color); + $: transform = getTransform(scale, translateX, translateY, rotate, flip, 1, "em", "deg"); - $: containerElement && transform && (containerElement.style.transform = transform); + $: if (containerElement) { + containerElement.style.transform = transform; + } + $: if (containerElement && size) { + setCustomFontSize(containerElement, size); + } + $: if (containerElement && color) { + containerElement.style.color = color; + } diff --git a/src/lib/fa-layers.svelte b/src/lib/fa-layers.svelte index 78f4fe8..8998a67 100644 --- a/src/lib/fa-layers.svelte +++ b/src/lib/fa-layers.svelte @@ -10,7 +10,9 @@ export let pull: PullDir | undefined = undefined; let containerElement: HTMLElement; - $: containerElement && size && setCustomFontSize(containerElement, size); + $: if (containerElement && size) { + setCustomFontSize(containerElement, size); + } diff --git a/src/lib/fa.svelte b/src/lib/fa.svelte index 448f53b..b1d4ae8 100644 --- a/src/lib/fa.svelte +++ b/src/lib/fa.svelte @@ -33,7 +33,9 @@ export let swapOpacity = false; let svgElement: HTMLElement | SVGElement; - $: svgElement && size && setCustomFontSize(svgElement, size); + $: if (svgElement && size) { + setCustomFontSize(svgElement, size); + } $: i = (icon && icon.icon) || [0, 0, "", [], ""]; diff --git a/test/basic.test.ts b/test/basic.test.ts index 7952847..272056a 100644 --- a/test/basic.test.ts +++ b/test/basic.test.ts @@ -1,6 +1,5 @@ import type { ComponentProps } from "svelte"; import { describe, expect, test, afterEach } from "vitest"; -// @ts-expect-error No typings available import { fasFlag, fasInfo } from "@cweili/fa-test-util"; import { render, screen, cleanup } from "@testing-library/svelte"; import Fa from "../src/lib/index.js"; @@ -205,6 +204,7 @@ test("title", async () => { }); const tag = await screen.findByText(title); + // eslint-disable-next-line @typescript-eslint/no-unused-expressions expect(tag).to.exist; // For backward compatibility with SVG 1.1, according to MDN expect(getFa().querySelector(":first-child")).toBe(tag); diff --git a/test/duotone.test.ts b/test/duotone.test.ts index fd45adb..910fa88 100644 --- a/test/duotone.test.ts +++ b/test/duotone.test.ts @@ -1,6 +1,5 @@ import type { ComponentProps } from "svelte"; import { expect, test, afterEach } from "vitest"; -// @ts-expect-error No typings available import { fasFlag, fadFlag, fadInfo } from "@cweili/fa-test-util"; import { render, screen, cleanup } from "@testing-library/svelte"; import Fa from "../src/lib/index.js";