Add tests

Author: webdevnerdstuff

Diff for: src/plugin/__tests__/index.test.ts

@@ -0,0 +1,13 @@
+import { describe, it, expect } from 'vitest';
+import { createVResizeDrawer } from '../';
+
+
+describe('Plugin Index', () => {
+	describe('install', () => {
+		it('should return install function', () => {
+			const VResizeDrawer = createVResizeDrawer();
+
+			expect('install' in VResizeDrawer).toBe(true);
+		});
+	});
+});

Diff for: src/plugin/composables/__tests__/__snapshots__/classes.test.ts.snap

@@ -0,0 +1,53 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`Classes Composable > useDrawerClasses > should return class object 1`] = `
+{
+  "v-navigation-drawer--absolute": false,
+  "v-navigation-drawer--custom-rail": true,
+  "v-navigation-drawer--fixed": true,
+  "v-navigation-drawer--floating": null,
+  "v-navigation-drawer--is-mouseover": false,
+  "v-navigation-drawer--left": true,
+  "v-navigation-drawer--open-on-hover": false,
+  "v-navigation-drawer--rail": false,
+  "v-navigation-drawer--right": false,
+  "v-navigation-drawer--temporary": false,
+  "v-resize-drawer": true,
+}
+`;
+
+exports[`Classes Composable > useHandleContainerClasses > should return class object 1`] = `
+{
+  "v-resize-drawer--handle-container": true,
+  "v-resize-drawer--handle-container-parent-start": true,
+  "v-resize-drawer--handle-container-position-center": true,
+}
+`;
+
+exports[`Classes Composable > useHandleContainerClasses > should return class object 2`] = `
+{
+  "v-resize-drawer--handle-container": true,
+  "v-resize-drawer--handle-container-parent-left": true,
+  "v-resize-drawer--handle-container-position-top": true,
+}
+`;
+
+exports[`Classes Composable > useHandleIconClasses > should return class object with fa classes as false 1`] = `
+{
+  "v-resize-drawer--handle-container-icon": true,
+  "v-resize-drawer--handle-container-icon-fa": false,
+  "v-resize-drawer--handle-container-icon-fa-top": false,
+  "v-resize-drawer--handle-container-icon-top-start": true,
+  "v-resize-drawer--handle-container-icon-user-icon": false,
+}
+`;
+
+exports[`Classes Composable > useHandleIconClasses > should return class object with fa classes as true 1`] = `
+{
+  "v-resize-drawer--handle-container-icon": true,
+  "v-resize-drawer--handle-container-icon-center-left": true,
+  "v-resize-drawer--handle-container-icon-fa": true,
+  "v-resize-drawer--handle-container-icon-fa-center": true,
+  "v-resize-drawer--handle-container-icon-user-icon": false,
+}
+`;

Diff for: src/plugin/composables/__tests__/classes.test.ts

@@ -0,0 +1,74 @@
+import { describe, it, expect } from 'vitest';
+import {
+	useDrawerClasses,
+	useHandleContainerClasses,
+	useHandleIconClasses,
+} from '../classes';
+
+
+describe('Classes Composable', () => {
+	describe('useDrawerClasses', () => {
+		it('should return class object', () => {
+			const classes = useDrawerClasses({
+				absolute: false,
+				expandOnHover: false,
+				floating: null,
+				isMouseover: false,
+				location: 'start',
+				rail: false,
+				railWidth: '8',
+				temporary: undefined,
+			});
+
+			expect(classes).toMatchSnapshot();
+		});
+	});
+
+	describe('useHandleContainerClasses', () => {
+		it('should return class object', () => {
+			const classes = useHandleContainerClasses({
+				drawerLocation: 'start',
+				handlePosition: 'center',
+			});
+
+			expect(classes).toMatchSnapshot();
+		});
+
+		it('should return class object', () => {
+			const classes = useHandleContainerClasses({
+				drawerLocation: 'left',
+				handlePosition: 'top',
+			});
+
+			expect(classes).toMatchSnapshot();
+		});
+	});
+
+	describe('useHandleIconClasses', () => {
+		it('should return class object with fa classes as false', () => {
+			const classes = useHandleIconClasses({
+				drawerLocation: 'start',
+				handlePosition: 'top',
+				iconOptions: {
+					defaultSet: 'mdi'
+				},
+				isUserIcon: false,
+			});
+
+			expect(classes).toMatchSnapshot();
+		});
+
+		it('should return class object with fa classes as true', () => {
+			const classes = useHandleIconClasses({
+				drawerLocation: 'left',
+				handlePosition: 'center',
+				iconOptions: {
+					defaultSet: 'fa'
+				},
+				isUserIcon: false,
+			});
+
+			expect(classes).toMatchSnapshot();
+		});
+	});
+});

Diff for: src/plugin/composables/__tests__/colors.test.ts

@@ -0,0 +1,75 @@
+import {
+	describe,
+	it,
+	expect,
+	vi,
+} from 'vitest';
+import {
+	useGetColor,
+} from '../colors';
+import vuetify from '../../../plugins/vuetify';
+
+const theme = vuetify.theme;
+
+
+describe('Colors Composable', () => {
+	describe('useGetColor', () => {
+		it('should return color name as HSL', () => {
+			const color = useGetColor('red', theme);
+			expect(color).toMatchInlineSnapshot(`"hsl(0 100% 50%)"`);
+		});
+
+		it('should return hex value as HSL', () => {
+			const color = useGetColor('#f00', theme);
+			expect(color).toMatchInlineSnapshot(`"hsl(0 100% 50%)"`);
+		});
+
+		it('should return RGB value as HSL', () => {
+			const color = useGetColor('rgb(255,0,0)', theme);
+			expect(color).toMatchInlineSnapshot(`"hsl(0 100% 50%)"`);
+		});
+
+		it('should return HSL value as HSL', () => {
+			const color = useGetColor('hsl(0 100% 50%)', theme);
+			expect(color).toMatchInlineSnapshot(`"hsl(0 100% 50%)"`);
+		});
+
+		it('should return theme variable as an RGB', () => {
+			const color = useGetColor('--v-theme-error', theme);
+			expect(color).toMatchInlineSnapshot(`"rgb(var(--v-theme-error))"`);
+		});
+
+		it('should return a non theme color option as default HSL color value', () => {
+			const color = useGetColor('foobar', theme);
+
+			expect(color).toMatchInlineSnapshot(`"hsl(0 0% 100% / 12%)"`);
+		});
+
+		it('should return a non theme variable as default HSL color value', () => {
+			const color = useGetColor('--v-foobar', theme);
+
+			expect(color).toMatchInlineSnapshot(`"hsl(0 0% 100% / 12%)"`);
+		});
+
+		// console.warn tests //
+		const logSpy = vi.spyOn(console, 'warn').mockImplementation(() => undefined);
+
+		it('should console warn when color prop "foobar" doesn\'t exist in colors', () => {
+			logSpy.mockReset();
+
+			useGetColor('foobar', theme);
+
+			expect(logSpy).toHaveBeenCalled();
+			expect(logSpy).toHaveBeenCalledTimes(1);
+		});
+
+		it('should console warn when color prop "--v-foobar" doesn\'t exist in colors', () => {
+			logSpy.mockReset();
+
+			useGetColor('--v-foobar', theme);
+
+			expect(logSpy).toHaveBeenCalled();
+			expect(logSpy).toHaveBeenCalledTimes(1);
+		});
+	});
+});

Diff for: src/plugin/composables/__tests__/helpers.test.ts

@@ -0,0 +1,29 @@
+import { describe, it, expect } from 'vitest';
+import {
+	useConvertToUnit,
+} from '../helpers';
+
+
+describe('Helpers Composable', () => {
+	describe('useConvertToUnit', () => {
+		it('should return string with a default px unit', () => {
+			const unit = useConvertToUnit({ value: '10' });
+			expect(unit).toBe('10px');
+		});
+
+		it('should return number with a default px unit', () => {
+			const unit = useConvertToUnit({ value: 10 });
+			expect(unit).toBe('10px');
+		});
+
+		it('should return string with a supplied unit', () => {
+			const unit = useConvertToUnit({ unit: 'em', value: '10' });
+			expect(unit).toBe('10em');
+		});
+
+		it('should return number with a supplied unit', () => {
+			const unit = useConvertToUnit({ unit: 'em', value: 10 });
+			expect(unit).toBe('10em');
+		});
+	});
+});

Diff for: src/plugin/composables/__tests__/icons.test.ts

@@ -0,0 +1,48 @@
+import { describe, it, expect } from 'vitest';
+import { useGetIcon } from '../icons';
+
+
+const iconOptions = {
+	defaultSet: 'mdi'
+};
+
+describe('Icon Composable', () => {
+	describe('useGetIcon', () => {
+		it('should return supplied icon value', () => {
+
+			const unit = useGetIcon({
+				icon: 'mdi:mdi-cog',
+				iconOptions,
+				name: 'top',
+			});
+
+			expect(unit).toMatchInlineSnapshot(`"mdi:mdi-cog"`);
+		});
+
+		it('should return icon value using name', () => {
+			const unit = useGetIcon({
+				icon: undefined,
+				iconOptions,
+				name: 'center',
+			});
+
+			expect(unit).toMatchInlineSnapshot(`"mdi:mdi-chevron-double-right"`);
+		});
+
+		it('throws error if vuetify defaultSet is not supplied', () => {
+			expect(() => useGetIcon({
+				icon: undefined,
+				iconOptions: {},
+				name: 'top',
+			})).toThrowError('[VResizeDrawer]: No default undefined icon set found.');
+		});
+
+		it('throws error if supplied name not found', () => {
+			expect(() => useGetIcon({
+				icon: undefined,
+				iconOptions,
+				name: 'foobar',
+			})).toThrowError('[VResizeDrawer]: No foobar icon found.');
+		});
+	});
+});