public/ydioy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

base: public:23bceeabc62a0dec265e47da7b5088557620a842
Branches Tags
public:production
..
compare: public:e7e7278577410e28369d3e7ef28de09c80ac156d
Branches Tags
public:production

No commits in common. "23bceeabc62a0dec265e47da7b5088557620a842" and "e7e7278577410e28369d3e7ef28de09c80ac156d" have entirely different histories.
23bceeabc6 ... e7e7278577

24 changed files with 2291 additions and 1485 deletions
Download patch file Download diff file Expand all files Collapse all files

38
.disabled.github/ISSUE_TEMPLATE/bug_report.md
View file

@ -1,38 +0,0 @@
---
name: Bug report
about: Create a report to help us improve
title: ''
labels: ''
assignees: ''
---
**Describe the bug**
A clear and concise description of what the bug is.
**To Reproduce**
Steps to reproduce the behavior:
1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error
**Expected behavior**
A clear and concise description of what you expected to happen.
**Screenshots**
If applicable, add screenshots to help explain your problem.
**Desktop (please complete the following information):**
- OS: [e.g. iOS]
- Browser [e.g. chrome, safari]
- Version [e.g. 22]
**Smartphone (please complete the following information):**
- Device: [e.g. iPhone6]
- OS: [e.g. iOS8.1]
- Browser [e.g. stock browser, safari]
- Version [e.g. 22]
**Additional context**
Add any other context about the problem here.

20
.disabled.github/ISSUE_TEMPLATE/feature_request.md
View file

@ -1,20 +0,0 @@
---
name: Feature request
about: Suggest an idea for this project
title: ''
labels: ''
assignees: ''
---
**Is your feature request related to a problem? Please describe.**
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
**Describe the solution you'd like**
A clear and concise description of what you want to happen.
**Describe alternatives you've considered**
A clear and concise description of any alternative solutions or features you've considered.
**Additional context**
Add any other context or screenshots about the feature request here.

39
.disabled.github/workflows/sonar.yml
View file

@ -1,39 +0,0 @@
name: Sonar
permissions:
contents: read
pull-requests: write
on:
push:
branches:
- production
pull_request:
branches:
- production
types: [opened, synchronize, reopened]
jobs:
sonarqube:
name: SonarQube
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
with:
fetch-depth: 0
- name: Setup node environment
uses: actions/setup-node@v4
with:
node-version: "22"
cache: "npm"
- name: Install dependencies
run: npm ci
- name: Type checking and linting
run: |
npm run type-check &&
npm run lint
- name: Run tests and generate coverage
run: npm run coverage
env:
CI: true
- name: SonarQube Scan
uses: SonarSource/sonarqube-scan-action@v6
env:
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}

66
.github/workflows/production-ci.yml vendored Normal file
View file

@ -0,0 +1,66 @@
name: SonarCloud Analysis
on:
push:
branches:
- production
jobs:
do-scan:
name: SonarCloud Scan
runs-on: ubuntu-latest
permissions:
contents: read
steps:
- name: Checkout code
uses: actions/checkout@v4
with:
fetch-depth: 0
- name: Set up Node
uses: actions/setup-node@v4
with:
node-version: "22"
cache: "npm"
- name: Install dependencies
run: npm ci
- name: Run tests and generate coverage
run: npm run coverage
continue-on-error: true
env:
CI: true
- name: SonarCloud Scan
uses: SonarSource/sonarqube-scan-action@master
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
with:
args: >
-Dsonar.projectKey=xliviux_ydioy
-Dsonar.organization=xliviux
-Dsonar.projectName=YDIOY
-Dsonar.sourceEncoding=UTF-8
-Dsonar.sources=src,tests
-Dsonar.inclusions=src/**/*.ts,src/**/*.js,src/**/*.vue,src/**/*.css,src/**/*.scss,tests/**/*.spec.ts
-Dsonar.exclusions=**/node_modules/**,**/coverage/**,*.config.ts
-Dsonar.coverage.exclusions=tests/**,*.config.ts
-Dsonar.javascript.lcov.reportPaths=coverage/lcov.info
-Dsonar.testExecutionReportPaths=coverage/sonar-report.xml
- name: Check SonarCloud Quality Gate
uses: sonarsource/sonarqube-quality-gate-action@master
timeout-minutes: 5
env:
SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}
- name: Upload test results
if: always()
uses: actions/upload-artifact@v4
with:
name: test-results
path: |
coverage/

9
CODE_OF_CONDUCT.md
View file

@ -1,9 +0,0 @@
# Community Guidelines for Conduct.
We follow this guidelines for conduct in all collaborative spaces, such as mailing lists, submitted patches, commit comments:
- All communication is done using English language.
- Participants are expected to be tolerant of opposing views.
- Participants must ensure that their language and actions are free from personal attacks and disparaging remarks.
- When interpreting the words and actions of others, participants should always assume good intentions.
- Behavior that could reasonably be considered harassment will not be tolerated.

9
CONTRIBUTING.md
View file

@ -1,9 +0,0 @@
# Contributing To "Your Data Is Only Yours"
## Steps
- Fork repository
- Add your contribution
- Open pull request
Thanks! :heart: :heart: :heart:

15
README.md
View file

@ -2,12 +2,9 @@
Your Data Is Only Yours
[![Lines of Code](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=ncloc)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Bugs](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=bugs)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Code Smells](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=code_smells)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Vulnerabilities](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=vulnerabilities)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Reliability Rating](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=reliability_rating)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Security Rating](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=security_rating)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=sqale_rating)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Coverage](https://sonarcloud.io/api/project_badges/measure?project=lburcusel_ydioy&metric=coverage)](https://sonarcloud.io/summary/new_code?id=lburcusel_ydioy)
[![Quality Gate Status](https://sonarcloud.io/api/project_badges/measure?project=xliviux_ydioy&metric=alert_status)](https://sonarcloud.io/summary/new_code?id=xliviux_ydioy)
[![Lines of Code](https://sonarcloud.io/api/project_badges/measure?project=xliviux_ydioy&metric=ncloc)](https://sonarcloud.io/summary/new_code?id=xliviux_ydioy)
[![Reliability Rating](https://sonarcloud.io/api/project_badges/measure?project=xliviux_ydioy&metric=reliability_rating)](https://sonarcloud.io/summary/new_code?id=xliviux_ydioy)
[![Security Rating](https://sonarcloud.io/api/project_badges/measure?project=xliviux_ydioy&metric=security_rating)](https://sonarcloud.io/summary/new_code?id=xliviux_ydioy)
[![Maintainability Rating](https://sonarcloud.io/api/project_badges/measure?project=xliviux_ydioy&metric=sqale_rating)](https://sonarcloud.io/summary/new_code?id=xliviux_ydioy)

6
eslint.config.ts → eslint.config.js
View file

@ -1,7 +1,6 @@
import eslint from "@eslint/js";
import eslintConfigPrettier from "eslint-config-prettier";
import eslintPluginVue from "eslint-plugin-vue";
import jsonc from "eslint-plugin-jsonc";
import globals from "globals";
import typescriptEslint from "typescript-eslint";
@ -25,12 +24,7 @@ export default typescriptEslint.config(
rules: {
"@typescript-eslint/no-explicit-any": "off",
"@typescript-eslint/no-require-imports": "off",
"@typescript-eslint/no-unused-vars": "warn",
},
},
{
files: ["**/*.json"],
extends: [...jsonc.configs["flat/recommended-with-json"]],
},
eslintConfigPrettier
);

3006
package-lock.json generated
View file

File diff suppressed because it is too large Load diff

18
package.json
View file

@ -15,8 +15,8 @@
"coverage": "vitest run --coverage",
"build-only": "vite build",
"type-check": "vue-tsc --build",
"lint": "eslint \"**/*.{js,json,ts,vue}\"",
"lint-files": "eslint --ext .js,.json,.ts,.vue"
"lint": "eslint \"**/*.{vue,ts}\"",
"lint-files": "eslint --ext .js,.ts,.vue"
},
"dependencies": {
"@mdi/font": "^7.4.47",
@ -27,28 +27,26 @@
},
"devDependencies": {
"@tsconfig/node22": "^22.0.2",
"@types/node": "^24.10.1",
"@types/node": "^22.16.5",
"@vitejs/plugin-vue": "^6.0.1",
"@vitest/coverage-v8": "^4.0.9",
"@vitest/coverage-v8": "^3.2.4",
"@vue/test-utils": "^2.4.6",
"@vue/tsconfig": "^0.8.1",
"@vue/tsconfig": "^0.7.0",
"eslint": "^9.38.0",
"eslint-config-prettier": "^10.1.8",
"eslint-plugin-jsonc": "^2.21.0",
"eslint-plugin-vue": "^10.5.1",
"globals": "^16.4.0",
"happy-dom": "^20.0.5",
"jiti": "^2.6.1",
"npm-run-all2": "^8.0.4",
"prettier": "3.6.2",
"resize-observer-polyfill": "^1.5.1",
"sass-embedded": "^1.92.1",
"typescript": "^5.9.3",
"typescript": "~5.8.0",
"typescript-eslint": "^8.46.1",
"vite": "^7.1.11",
"vite-plugin-vue-devtools": "^8.0.0",
"vitest": "^4.0.9",
"vitest-sonar-reporter": "^3.0.0",
"vitest": "^3.2.4",
"vitest-sonar-reporter": "^2.0.4",
"vue-tsc": "^3.0.4"
}
}

8
sonar-project.properties
View file

@ -1,11 +1,11 @@
sonar.projectKey=lburcusel_ydioy
sonar.organization=lburcusel
sonar.projectKey=xliviux_ydioy
sonar.organization=xliviux
sonar.projectName=YDIOY
sonar.projectVersion=1.0.0
sonar.projectVersion=1.0.0-1
sonar.sourceEncoding=UTF-8
sonar.sources=src, tests
sonar.inclusions=src/**/*.ts, src/**/*.js, src/**/*.vue, src/**/*.css, src/**/*.scss, tests/**/*.spec.ts
sonar.exclusions=**/node_modules/**, **/coverage/**, *.config.ts
sonar.coverage.exclusions=tests/**, *.config.ts
sonar.javascript.lcov.reportPaths=coverage/lcov.info
# sonar.testExecutionReportPaths=coverage/sonar-report.xml
sonar.testExecutionReportPaths=coverage/sonar-report.xml

12
src/components/HeaderNavBar.vue
View file

@ -7,7 +7,12 @@ import { RouterLink } from "vue-router";
<v-container class="d-flex align-center pa-0">
<div class="d-flex align-center">
<RouterLink v-slot="{ isActive }" class="mx-2 text-decoration-none" to="/" data-role="homeNavigation">
<v-btn :variant="isActive ? 'elevated' : 'outlined'" color="primary" size="large" prepend-icon="mdi-home-outline">
<v-btn
:variant="isActive ? 'elevated' : 'outlined'"
color="primary"
size="large"
prepend-icon="mdi-home-outline"
>
Home
</v-btn>
</RouterLink>
@ -21,11 +26,6 @@ import { RouterLink } from "vue-router";
About
</v-btn>
</RouterLink>
<RouterLink v-slot="{ isActive }" class="mx-2 text-decoration-none" to="/settings" data-role="settingsNavigation">
<v-btn :variant="isActive ? 'elevated' : 'outlined'" color="primary" size="large" prepend-icon="mdi-cog-outline">
Settings
</v-btn>
</RouterLink>
</div>
</v-container>
</v-app-bar>

5
src/router/index.ts
View file

@ -14,11 +14,6 @@ const router = createRouter({
name: "about",
component: () => import("../views/AboutView.vue"),
},
{
path: "/settings",
name: "settings",
component: () => import("~/views/SettingView.vue"),
},
],
});

5
src/views/SettingView.vue
View file

@ -1,5 +0,0 @@
<template>
<article>
<h1 class="text-h2 text-primary"><i class="mdi mdi-cog-outline"></i>Settings</h1>
</article>
</template>

49
tests/App.spec.ts
View file

@ -1,49 +0,0 @@
import { describe, expect, it } from "vitest";
import { mount, type VueWrapper } from "@vue/test-utils";
import { vuetify } from "./setup.vuetify";
import App from "~/App.vue";
describe("App.vue", () => {
const wrapper: VueWrapper = mount(App, {
global: {
plugins: [vuetify],
stubs: {
HeaderNavBar: true,
FooterComponent: true,
RouterView: true,
},
},
});
describe("Component Structure", () => {
it("renders the component", () => {
expect(wrapper.exists()).toBe(true);
});
it("renders v-app as the root element", () => {
expect(wrapper.find(".v-application").exists()).toBe(true);
});
it("renders HeaderNavBar component", () => {
expect(wrapper.findComponent({ name: "HeaderNavBar" }).exists()).toBe(true);
});
it("renders FooterComponent component", () => {
expect(wrapper.findComponent({ name: "FooterComponent" }).exists()).toBe(true);
});
it("renders v-main element", () => {
expect(wrapper.find(".v-main").exists()).toBe(true);
});
it("renders v-container inside v-main", () => {
const main = wrapper.find(".v-main");
expect(main.find(".v-container").exists()).toBe(true);
});
it("renders RouterView component", () => {
expect(wrapper.findComponent({ name: "RouterView" }).exists()).toBe(true);
});
});
});

114
tests/components/HeardeNavBar.spec.ts
View file

@ -1,138 +1,116 @@
import { describe, it, expect, beforeEach } from "vitest";
import { mount } from "@vue/test-utils";
import { createRouter, createWebHistory } from "vue-router";
import { createVuetify } from "vuetify";
import * as components from "vuetify/components";
import * as directives from "vuetify/directives";
import HeaderNavBar from "../../src/components/HeaderNavBar.vue";
import { describe, it, expect, beforeEach } from "vitest"
import { mount } from "@vue/test-utils"
import { createRouter, createWebHistory } from "vue-router"
import { createVuetify } from "vuetify"
import * as components from 'vuetify/components'
import * as directives from 'vuetify/directives'
import HeaderNavBar from "../../src/components/HeaderNavBar.vue"
globalThis.ResizeObserver = require("resize-observer-polyfill");
globalThis.ResizeObserver = require('resize-observer-polyfill');
// Mock routes for testing
const routes = [
{ path: "/", component: { template: "<div>Home</div>" } },
{ path: "/about", component: { template: "<div>About</div>" } },
{ path: "/settings", component: { template: "<div>Settings</div>" } },
];
{ path: "/about", component: { template: "<div>About</div>" } }
]
const router = createRouter({
history: createWebHistory(),
routes,
routes
});
const vuetify = createVuetify({
components,
directives,
});
})
describe("HeaderNavBar", () => {
let wrapper: any;
let wrapper: any
beforeEach(() => {
wrapper = mount(
{
template: `
wrapper = mount({
template: `
<v-app>
<v-layout>
<HeaderNavBar />
</v-layout>
</v-app>
`,
},
{
global: {
components: {
HeaderNavBar,
},
plugins: [router, vuetify],
},
}, {
global: {
components: {
HeaderNavBar,
},
plugins: [router, vuetify]
}
);
});
})
})
it("renders the component", () => {
expect(wrapper.exists()).toBe(true);
expect(wrapper.findComponent({ name: "VAppBar" }).exists()).toBe(true);
});
expect(wrapper.exists()).toBe(true)
expect(wrapper.findComponent({ name: "VAppBar" }).exists()).toBe(true)
})
it("renders all navigation buttons", () => {
it("renders both navigation buttons", () => {
const homeButton = wrapper.find("[data-role='homeNavigation']");
const aboutButton = wrapper.find("[data-role='aboutNavigation']");
const settingsButton = wrapper.find("[data-role='settingsNavigation']");
expect(homeButton.exists()).toBe(true);
expect(aboutButton.exists()).toBe(true);
expect(settingsButton.exists()).toBe(true);
expect(homeButton.text()).toContain("Home");
expect(aboutButton.text()).toContain("About");
expect(settingsButton.text()).toContain("Settings");
});
it("has correct icons on buttons", () => {
const homeButton = wrapper.find("[data-role='homeNavigation']");
const aboutButton = wrapper.find("[data-role='aboutNavigation']");
const settingsButton = wrapper.find("[data-role='settingsNavigation']");
expect(homeButton.find("i").attributes("class")).toContain("mdi-home-outline");
expect(aboutButton.find("i").attributes("class")).toContain("mdi-chat-question-outline");
expect(settingsButton.find("i").attributes("class")).toContain("mdi-cog-outline");
expect(homeButton.find("i").attributes("class")).toContain("mdi-home-outline");
expect(aboutButton.find("i").attributes("class")).toContain("mdi-chat-question-outline");
});
it("has correct RouterLink paths", () => {
const routerLinks = wrapper.findAllComponents({ name: "RouterLink" });
expect(routerLinks).toHaveLength(3);
expect(routerLinks).toHaveLength(2);
expect(routerLinks[0].props("to")).toBe("/");
expect(routerLinks[1].props("to")).toBe("/about");
expect(routerLinks[2].props("to")).toBe("/settings");
});
it("applies correct button variants based on active route", async () => {
// Navigate to home route
await router.push("/");
await wrapper.vm.$nextTick();
await router.push("/")
await wrapper.vm.$nextTick()
// Check home button is elevated and the rest are outlined
// Check home button is elevated (active) and about is outlined (inactive)
const homeButton = wrapper.find("[data-role='homeNavigation']");
const aboutButton = wrapper.find("[data-role='aboutNavigation']");
const settingsButton = wrapper.find("[data-role='settingsNavigation']");
expect(homeButton.find("button").attributes("class")).toContain("elevated");
expect(aboutButton.find("button").attributes("class")).toContain("outlined");
expect(settingsButton.find("button").attributes("class")).toContain("outlined");
expect(homeButton.find("button").attributes("class")).toContain("elevated");
expect(aboutButton.find("button").attributes("class")).toContain("outlined");
// Navigate to about route
// // Navigate to about route
await router.push("/about");
await wrapper.vm.$nextTick();
// Check about button is now elevated and the rest are outlined
// // Check about button is now elevated and home is outlined
expect(homeButton.find("button").attributes("class")).toContain("outlined");
expect(aboutButton.find("button").attributes("class")).toContain("elevated");
expect(settingsButton.find("button").attributes("class")).toContain("outlined");
// Navigate to settings route
await router.push("/settings");
await wrapper.vm.$nextTick();
// Check about button is now elevated and the rest are outlined
expect(homeButton.find("button").attributes("class")).toContain("outlined");
expect(aboutButton.find("button").attributes("class")).toContain("outlined");
expect(settingsButton.find("button").attributes("class")).toContain("elevated");
expect(aboutButton.find("button").attributes("class")).toContain("elevated");
});
it("has correct button styling classes", () => {
const routerLinks = wrapper.findAllComponents({ name: "RouterLink" });
for (const link of routerLinks) {
expect(link.classes()).toContain("mx-2");
expect(link.classes()).toContain("text-decoration-none");
expect(link.classes()).toContain("mx-2")
expect(link.classes()).toContain("text-decoration-none")
}
const buttons = wrapper.findAllComponents({ name: "v-btn" });
const buttons = wrapper.findAllComponents({ name: "v-btn" });
for (const button of buttons) {
expect(button.attributes("class")).toContain("v-btn--size-large");
expect(button.attributes("class")).toContain("-primary");
}
expect(button.attributes("class")).toContain("v-btn--size-large");
expect(button.attributes("class")).toContain("-primary");
}
});
it("has proper app bar structure", () => {
@ -148,11 +126,11 @@ describe("HeaderNavBar", () => {
it("maintains accessibility attributes", () => {
const homeButton = wrapper.find("[data-role='homeNavigation']");
expect(homeButton.attributes("data-role")).toBe("homeNavigation");
expect(homeButton.attributes("data-role")).toBe('homeNavigation');
// Check that buttons are actual button elements for screen readers
const buttons = wrapper.findAll("button");
expect(buttons).toHaveLength(3);
expect(buttons).toHaveLength(2);
for (const button of buttons) {
expect(button.element.tagName).toBe("BUTTON");
}

41
tests/main.spec.ts
View file

@ -1,55 +1,52 @@
import { beforeEach, describe, expect, it, vi } from "vitest";
import { createApp } from "vue";
import App from "~/App.vue";
import vuetify from "~/plugins/vuetify";
import router from "~/router";
import { describe, it, expect, vi, beforeEach } from 'vitest';
import { createApp } from 'vue';
import App from '../src/App.vue';
import vuetify from '../src/plugins/vuetify';
import router from '../src/router';
vi.mock("vue", async () => {
const actual = await vi.importActual("vue");
vi.mock('vue', async () => {
const actual = await vi.importActual('vue');
return {
...actual,
createApp: vi.fn(),
};
});
vi.mock("./assets/main.css", () => ({}));
vi.mock('./assets/main.css', () => ({}));
vi.mock("./plugins/vuetify", () => ({
vi.mock('./plugins/vuetify', () => ({
default: {
install: vi.fn(),
},
}));
vi.mock("./router", () => ({
vi.mock('./router', () => ({
default: {
install: vi.fn(),
},
}));
describe("main.ts", () => {
describe('main.ts', () => {
beforeEach(() => {
document.body.innerHTML = '<div id="app"></div>';
vi.mocked(createApp).mockImplementation(
() =>
({
use: vi.fn(),
mount: vi.fn(),
}) as any
);
vi.mocked(createApp).mockImplementation(() => ({
use: vi.fn(),
mount: vi.fn(),
} as any));
});
it("creates app and uses plugins", async () => {
await import("~/main");
it('creates app and uses plugins', async () => {
await import("../src/main");
expect(createApp).toHaveBeenCalledTimes(1);
expect(createApp).toHaveBeenCalledWith(App);
const appMock = vi.mocked(createApp).mock.results[0]?.value;
const appMock = vi.mocked(createApp).mock.results[0].value;
expect(appMock.use).toHaveBeenCalledTimes(2);
expect(appMock.use).toHaveBeenCalledWith(vuetify);
expect(appMock.use).toHaveBeenCalledWith(router);
expect(appMock.mount).toHaveBeenCalledTimes(1);
expect(appMock.mount).toHaveBeenCalledWith("#app");
expect(appMock.mount).toHaveBeenCalledWith('#app');
});
});

265
tests/router/index.spec.ts
View file

@ -1,141 +1,168 @@
import { describe, it, expect, beforeEach } from "vitest";
import router from "~/router/index";
describe("Router Integration Tests", () => {
const testRoutes = [
{ path: "/", name: "home", lazyLoaded: false },
{ path: "/about", name: "about", lazyLoaded: true },
{ path: "/settings", name: "settings", lazyLoaded: true },
];
beforeEach(async () => {
await router.push("/");
await router.isReady();
});
describe("General", () => {
it("has hash history mode", () => {
expect(router.options.history.base).toContain("#");
});
it("has 3 routes configured", () => {
const routes = router.getRoutes();
expect(routes).toHaveLength(3);
});
it("creates a router instance", () => {
expect(router).toBeDefined();
expect(router).toHaveProperty("currentRoute");
expect(router).toHaveProperty("push");
expect(router).toHaveProperty("replace");
});
it("does not have undefined routes", () => {
expect(router.hasRoute("nonexistent")).toBe(false);
});
it("maintains navigation history", async () => {
await router.push("/");
await router.push("/about");
expect(router.currentRoute.value.path).toBe("/about");
router.back();
await router.isReady();
expect(router.back).toBeDefined();
});
it("handles programmatic navigation with replace", async () => {
await router.push("/");
await router.replace("/about");
await router.isReady();
expect(router.currentRoute.value.path).toBe("/about");
});
it("matches routes case-sensitively", () => {
const routes = router.getRoutes();
const upperCaseRoute = routes.find(route => route.path === "/ABOUT");
expect(upperCaseRoute).toBeUndefined();
});
it("provides route metadata access", () => {
const routes = router.getRoutes();
for (const route of routes) {
expect(route).toHaveProperty("path");
expect(route).toHaveProperty("name");
expect(route).toHaveProperty("meta");
}
});
it("is ready after initialization", async () => {
const ready = await router.isReady();
// Note: isReady() returns void when resolved
expect(ready).toBeUndefined();
});
it("handles navigation to current route", async () => {
await router.push("/");
try {
await router.push("/");
} catch (error: any) {
expect(error.message).toContain("Avoided redundant navigation to current location");
}
});
it("creates a router instance", () => {
expect(router).toBeDefined();
expect(router).toHaveProperty("currentRoute");
expect(router).toHaveProperty("push");
expect(router).toHaveProperty("replace");
});
for (const r of testRoutes) {
describe(r.name, () => {
it("has route", () => {
const routes = router.getRoutes();
const currentRoute = routes.find(route => route.path === r.path);
it("has hash history mode", () => {
expect(router.options.history.base).toContain("#");
});
expect(currentRoute).toBeDefined();
expect(currentRoute?.name).toBe(r.name);
});
it("has 2 routes configured", () => {
const routes = router.getRoutes();
expect(routes).toHaveLength(2);
});
it("checks if route exists", () => {
expect(router.hasRoute(r.name)).toBe(true);
});
it("has home route at root path", () => {
const routes = router.getRoutes();
const homeRoute = routes.find(route => route.path === "/");
it("navigates to route", async () => {
await router.push(r.path);
await router.isReady();
expect(homeRoute).toBeDefined();
expect(homeRoute?.name).toBe("home");
});
expect(router.currentRoute.value.path).toBe(r.path);
expect(router.currentRoute.value.name).toBe(r.name);
});
it("has about route", () => {
const routes = router.getRoutes();
const aboutRoute = routes.find(route => route.path === "/about");
it("navigates using route name", async () => {
await router.push({ name: r.name });
await router.isReady();
expect(aboutRoute).toBeDefined();
expect(aboutRoute?.name).toBe("about");
});
expect(router.currentRoute.value.name).toBe(r.name);
expect(router.currentRoute.value.path).toBe(r.path);
});
it("navigates to home route", async () => {
await router.push("/");
await router.isReady();
it("resolves route correctly", () => {
const resolved = router.resolve(r.path);
expect(router.currentRoute.value.path).toBe("/");
expect(router.currentRoute.value.name).toBe("home");
});
expect(resolved.name).toBe(r.name);
expect(resolved.path).toBe(r.path);
});
it("navigates to about route", async () => {
await router.push("/about");
await router.isReady();
it("has (lazy) loaded component", () => {
const routes = router.getRoutes();
const currentRoute = routes.find(route => route.path === r.path);
expect(router.currentRoute.value.path).toBe("/about");
expect(router.currentRoute.value.name).toBe("about");
});
if (r.lazyLoaded) {
expect(currentRoute?.components).toBeDefined();
} else {
expect(currentRoute?.components?.default).toBeDefined();
}
});
});
}
it("navigates using route name for home", async () => {
await router.push({ name: "home" });
await router.isReady();
expect(router.currentRoute.value.name).toBe("home");
expect(router.currentRoute.value.path).toBe("/");
});
it("navigates using route name for about", async () => {
await router.push({ name: "about" });
await router.isReady();
expect(router.currentRoute.value.name).toBe("about");
expect(router.currentRoute.value.path).toBe("/about");
});
it("resolves home route correctly", () => {
const resolved = router.resolve("/");
expect(resolved.name).toBe("home");
expect(resolved.path).toBe("/");
});
it("resolves about route correctly", () => {
const resolved = router.resolve("/about");
expect(resolved.name).toBe("about");
expect(resolved.path).toBe("/about");
});
it("has HomeView component for home route", () => {
const routes = router.getRoutes();
const homeRoute = routes.find(route => route.path === "/");
expect(homeRoute?.components?.default).toBeDefined();
});
it("has lazy loaded component for about route", () => {
const routes = router.getRoutes();
const aboutRoute = routes.find(route => route.path === "/about");
expect(aboutRoute?.components).toBeDefined();
});
it("checks if home route exists", () => {
expect(router.hasRoute("home")).toBe(true);
});
it("checks if about route exists", () => {
expect(router.hasRoute("about")).toBe(true);
});
it("does not have undefined routes", () => {
expect(router.hasRoute("nonexistent")).toBe(false);
});
it("maintains navigation history", async () => {
await router.push("/");
await router.push("/about");
expect(router.currentRoute.value.path).toBe("/about");
router.back();
await router.isReady();
expect(router.back).toBeDefined();
});
it("handles programmatic navigation with replace", async () => {
await router.push("/");
await router.replace("/about");
await router.isReady();
expect(router.currentRoute.value.path).toBe("/about");
});
it("matches routes case-sensitively", () => {
const routes = router.getRoutes();
const upperCaseRoute = routes.find(route => route.path === "/ABOUT");
expect(upperCaseRoute).toBeUndefined();
});
it("provides route metadata access", () => {
const routes = router.getRoutes();
for (const route of routes) {
expect(route).toHaveProperty("path");
expect(route).toHaveProperty("name");
expect(route).toHaveProperty("meta");
}
});
it("is ready after initialization", async () => {
const ready = await router.isReady();
// Note: isReady() returns void when resolved
expect(ready).toBeUndefined();
});
it("handles navigation to current route", async () => {
await router.push("/");
try {
await router.push("/");
} catch (error: any) {
expect(error.message).toContain("Avoided redundant navigation to current location");
}
});
});

10
tests/setup.vuetify.ts
View file

@ -1,10 +0,0 @@
import { createVuetify } from "vuetify";
import * as components from "vuetify/components";
import * as directives from "vuetify/directives";
const vuetify = createVuetify({
components,
directives,
});
export { vuetify };

10
tests/views/SettingsView.spec.ts
View file

@ -1,10 +0,0 @@
import { describe, expect, it } from "vitest";
import { mount, VueWrapper } from "@vue/test-utils";
import SettingView from "~/views/SettingView.vue";
describe("SettingView.vue", () => {
const wrapper: VueWrapper = mount(SettingView, {});
it("renders without crashing", () => {
expect(wrapper.exists()).toBe(true);
});
});

4
tsconfig.app.json
View file

@ -24,7 +24,7 @@
"paths": {
"~/*": ["./src/*"],
"@/*": ["./src/*"]
"@/*": ["./src/*"],
}
}
},
}

6
tsconfig.json
View file

@ -14,7 +14,7 @@
"compilerOptions": {
"paths": {
"~/*": ["./src/*"],
"@/*": ["./src/*"]
}
}
"@/*": ["./src/*"],
},
},
}

8
tsconfig.vitest.json
View file

@ -1,14 +1,10 @@
{
"extends": "./tsconfig.app.json",
"include": ["tests/**/*.ts", "env.d.ts", "src/**/*", "src/**/*.vue"],
"include": ["tests/**/*.spec.ts", "env.d.ts", "src/**/*", "src/**/*.vue"],
"exclude": [],
"compilerOptions": {
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.vitest.tsbuildinfo",
"types": ["node", "happy-dom"]
"types": ["node", "happy-dom"],
},
"paths": {
"~/*": ["./src/*"],
"@/*": ["./src/*"]
}
}

9
vitest.config.ts
View file

@ -9,11 +9,12 @@ export default mergeConfig(
environment: "happy-dom",
exclude: [...configDefaults.exclude, "e2e/**"],
root: fileURLToPath(new URL("./", import.meta.url)),
setupFiles: ["./tests/setup.vuetify.ts"],
reporters: ["default", ["vitest-sonar-reporter", { outputFile: "coverage/sonar-report.xml" }]],
reporters: [
'default',
['vitest-sonar-reporter', { outputFile: 'coverage/sonar-report.xml' }],
],
coverage: {
reporter: ["text", "lcov"],
exclude: [...(configDefaults.coverage.exclude || []), "**/*.css", "**/*.scss"],
},
server: {
deps: {
@ -21,5 +22,5 @@ export default mergeConfig(
},
},
},
})
}),
);