svelte-ux icon indicating copy to clipboard operation
svelte-ux copied to clipboard

Published 20 hours ago • verified publisher icon techniq

Handle svelte-check warnings

Open techniq opened this issue 1 year ago • 1 comments

  • [ ] Handle all svelte-check warnings (A11y, unused variables, etc) so the console is clean
    • Possibly leverage <!-- svelte-ignore ... --> temporarily
  • [ ] Setup CI to run svelte-check and fail build
  • [ ] If <!-- svelte-ignore ... --> is used, properly handle remaining items
  • [ ] Rinse/repeat in LayerChart
  • [ ] Enjoy a peaceful dev experience with improved accessibility
12:25:47 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/ListItem.svelte:38:0 A11y: Non-interactive element <li> should not be assigned mouse or keyboard event listeners.
12:25:47 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/ButtonGroup.svelte:34:0 A11y: Non-interactive element <div> should not be assigned mouse or keyboard event listeners.
12:25:47 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Tooltip.svelte:92:0 A11y: <div> with mouseenter, mouseleave, click handlers must have an ARIA role
12:25:47 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Dialog.svelte:72:2 A11y: <div> with click, mouseup, keydown handlers must have an ARIA role
12:25:48 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Backdrop.svelte:11:0 A11y: <div> with keydown, keyup, keypress, click, mousedown, mouseup handlers must have an ARIA role
12:25:48 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Field.svelte:108:8 A11y: <div> with click handler must have an ARIA role
12:25:49 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/SelectField.svelte:32:11 SelectField has unused export property 'tabindex'. If it is for external reference only, please consider using `export const tabindex`
12:25:49 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Menu.svelte:62:2 A11y: Non-interactive element <menu> should not be assigned mouse or keyboard event listeners.
12:25:49 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/_SelectListOptions.svelte:5:11 SelectListOptions has unused export property 'optionText'. If it is for external reference only, please consider using `export const optionText`
12:25:49 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/_SelectListOptions.svelte:8:11 SelectListOptions has unused export property 'selectOption'. If it is for external reference only, please consider using `export const selectOption`
12:25:49 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/_SelectListOptions.svelte:14:11 SelectListOptions has unused export property 'value'. If it is for external reference only, please consider using `export const value`
12:25:49 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/_SelectListOptions.svelte:15:11 SelectListOptions has unused export property 'selected'. If it is for external reference only, please consider using `export const selected`
12:25:49 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/_SelectListOptions.svelte:16:11 SelectListOptions has unused export property 'highlightIndex'. If it is for external reference only, please consider using `export const highlightIndex`
12:25:58 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/ToggleOption.svelte:25:0 A11y: Non-interactive element <label> should not be assigned mouse or keyboard event listeners.
12:26:16 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/docs/Link.svelte:1:0 A11y: <a> element should have an href attribute
12:26:32 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Drawer.svelte:40:2 A11y: <div> with keydown, mouseup handlers must have an ARIA role
12:26:32 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/MultiSelectField.svelte:98:0 A11y: <div> with click handler must have an ARIA role
12:26:36 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Grid.svelte:45:0 A11y: <div> with click handler must have an ARIA role
12:26:36 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Notification.svelte:38:2 A11y: <div> with click, keypress handlers must have an ARIA role
12:26:37 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/RangeSlider.svelte:213:2 A11y: <div> with mouseenter, mouseleave handlers must have an ARIA role
12:26:37 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/RangeSlider.svelte:223:2 A11y: <div> with mouseenter, mouseleave, dblclick handlers must have an ARIA role
12:26:37 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/RangeSlider.svelte:244:2 A11y: <div> with mouseenter, mouseleave, dblclick handlers must have an ARIA role
12:26:37 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/RangeSlider.svelte:263:2 A11y: <div> with mouseenter, mouseleave, dblclick handlers must have an ARIA role
12:26:37 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/RangeSlider.svelte:198:0 A11y: <div> with click, keydown handlers must have an ARIA role
12:26:37 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/lib/components/Tilt.svelte:31:0 A11y: <div> with mousemove, mouseleave handlers must have an ARIA role
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:440:10 A11y: visible, non-interactive elements with an on:click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as <button type="button"> or <a> might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:440:10 A11y: <div> with click handler must have an ARIA role
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:504:6 A11y: visible, non-interactive elements with an on:click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as <button type="button"> or <a> might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:504:6 A11y: <div> with click handler must have an ARIA role
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:617:6 A11y: visible, non-interactive elements with an on:click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as <button type="button"> or <a> might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:617:6 A11y: <span> with click handler must have an ARIA role
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:760:4 A11y: visible, non-interactive elements with an on:click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as <button type="button"> or <a> might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:760:4 A11y: <div> with click handler must have an ARIA role
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:869:4 A11y: visible, non-interactive elements with an on:click event must be accompanied by a keyboard event handler. Consider whether an interactive element such as <button type="button"> or <a> might be more appropriate. See https://svelte.dev/docs/accessibility-warnings#a11y-click-events-have-key-events for more details.
12:26:45 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/SelectField/+page.svelte:869:4 A11y: <span> with click handler must have an ARIA role
12:26:47 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/Switch/+page.svelte:52:4 A11y: A form label must be associated with a control.
12:26:47 PM [vite-plugin-svelte] /Users/techniq/Documents/Development/open-source/svelte-ux/packages/svelte-ux/src/routes/docs/components/Switch/+page.svelte:56:4 A11y: A form label must be associated with a control.

techniq avatar Jan 05 '24 17:01 techniq

in user land, if you add in svelte.config.js the function onwarn:

/** @type {import('@sveltejs/kit').Config} */
const config = {
	// ...

	onwarn(warning, defaultHandler) {
		// Do not show 3rd party warnings
		if (warning.filename.includes('node_modules')) return

		defaultHandler(warning)
	},

	// ...
}

export default config

I find it nice until it's "fixed" 😉

jycouet avatar May 06 '24 11:05 jycouet

Making good progress in PR #409

techniq avatar Jun 23 '24 06:06 techniq

zoolander-will-ferrell

image

image

techniq avatar Jun 23 '24 20:06 techniq

zoolander-will-ferrell zoolander-will-ferrell

image

image

That's AMAZING!!!! Good job

jycouet avatar Jun 24 '24 06:06 jycouet

Thanks @jycouet. LayerChart is in progress as well

techniq avatar Jun 24 '24 12:06 techniq

Sorry for the delay, but Svelte UX 0.71.0 and LayerChart 0.43.0 now provide a much improved Typescript and A11y experience, and a clean console on startup 😁. Typescript and A11y improvements will continue, especially during the Svelte 5 migration. I would appreciate any help on on both of these (searching the codebase for <!-- svelte-ignore ... --> or // @ts-expect-error) as well

techniq avatar Jun 27 '24 14:06 techniq