scottk/chatwoot
1
0
Fork 0
mirror of https://github.com/lingble/chatwoot.git synced 2025-10-29 18:22:53 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: fix circleci on vite build (#10214)

Browse Source 
- Switch to pnpm based build
- Switch circleci from docker to machine to have more memory
- Fix frontend and backend tests

Fixes
https://linear.app/chatwoot/issue/CW-3610/fix-circle-ci-for-vite-build
---------

Co-authored-by: Shivam Mishra <scm.mymail@gmail.com>
Co-authored-by: Pranav <pranavrajs@gmail.com>
Co-authored-by: Pranav <pranav@chatwoot.com>
This commit is contained in:
Vishnu Narayanan
2024-10-07 15:27:41 +05:30
committed by GitHub
parent 0677d8763d
commit ee02923ace
54 changed files with 1130 additions and 1334 deletions
Download Patch File Download Diff File Expand all files Collapse all files

246
.circleci/config.yml
View File

@@ -1,84 +1,87 @@
# Ruby CircleCI 2.0 configuration file
#
# Check https://circleci.com/docs/2.0/language-ruby/ for more details
#
version: 2
version: 2.1
orbs:
node: circleci/node@6.1.0
defaults: &defaults
working_directory: ~/build
docker:
# specify the version you desire here
- image: cimg/ruby:3.3.3-browsers
# Specify service dependencies here if necessary
# CircleCI maintains a library of pre-built images
# documented at https://circleci.com/docs/2.0/circleci-images/
- image: cimg/postgres:15.3
- image: cimg/redis:6.2.6
environment:
- RAILS_LOG_TO_STDOUT: false
- COVERAGE: true
- LOG_LEVEL: warn
parallelism: 4
machine:
image: ubuntu-2204:2024.05.1
resource_class: large
environment:
RAILS_LOG_TO_STDOUT: false
COVERAGE: true
LOG_LEVEL: warn
parallelism: 4
jobs:
build:
<<: *defaults
steps:
- checkout
- node/install:
node-version: '20.12'
- node/install-pnpm
- node/install-packages:
pkg-manager: pnpm
override-ci-command: pnpm i
- run: node --version
- run: pnpm --version
- run:
name: Configure Bundler
name: Install System Dependencies
command: |
echo 'export BUNDLER_VERSION=$(cat Gemfile.lock | tail -1 | tr -d " ")' >> $BASH_ENV
source $BASH_ENV
sudo apt-get update
DEBIAN_FRONTEND=noninteractive sudo apt-get install -y \
libpq-dev \
redis-server \
postgresql \
build-essential \
git \
curl \
libssl-dev \
zlib1g-dev \
libreadline-dev \
libyaml-dev \
openjdk-11-jdk \
jq \
software-properties-common \
ca-certificates \
imagemagick \
libxml2-dev \
libxslt1-dev \
file \
g++ \
gcc \
autoconf \
gnupg2 \
patch \
ruby-dev \
liblzma-dev \
libgmp-dev \
libncurses5-dev \
libffi-dev \
libgdbm6 \
libgdbm-dev \
libvips
- run:
name: Install RVM and Ruby 3.3.3
command: |
sudo apt-get install -y gpg
gpg --keyserver hkp://keyserver.ubuntu.com --recv-keys 409B6B1796C275462A1703113804BB82D39DC0E3 7D2BAF1CF37B13E2069D6956105BD0E739499BDB
\curl -sSL https://get.rvm.io | bash -s stable
echo 'source ~/.rvm/scripts/rvm' >> $BASH_ENV
source ~/.rvm/scripts/rvm
rvm install "3.3.3"
rvm use 3.3.3 --default
gem install bundler
- run:
name: Which bundler?
command: bundle -v
- run:
name: Swap node versions
name: Install Application Dependencies
command: |
set +e
wget -qO- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"
nvm install v20
echo 'export NVM_DIR="$HOME/.nvm"' >> $BASH_ENV
echo '[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"' >> $BASH_ENV
# Run bundler
# Load installed gems from cache if possible, bundle install then save cache
# Multiple caches are used to increase the chance of a cache hit
- restore_cache:
keys:
- chatwoot-bundle-{{ .Environment.CACHE_VERSION }}-v20220524-{{ checksum "Gemfile.lock" }}
- run: bundle install --frozen --path ~/.bundle
- save_cache:
paths:
- ~/.bundle
key: chatwoot-bundle-{{ .Environment.CACHE_VERSION }}-v20220524-{{ checksum "Gemfile.lock" }}
# Only necessary if app uses webpacker or yarn in some other way
- restore_cache:
keys:
- chatwoot-yarn-{{ .Environment.CACHE_VERSION }}-{{ checksum "yarn.lock" }}
- chatwoot-yarn-
- run:
name: yarn
command: yarn install --frozen-lockfile --cache-folder ~/.cache/yarn
# Store yarn / webpacker cache
- save_cache:
key: chatwoot-yarn-{{ .Environment.CACHE_VERSION }}-{{ checksum "yarn.lock" }}
paths:
- ~/.cache/yarn
source ~/.rvm/scripts/rvm
bundle install
# pnpm install
- run:
name: Download cc-test-reporter
@@ -86,12 +89,8 @@ jobs:
mkdir -p ~/tmp
curl -L https://codeclimate.com/downloads/test-reporter/test-reporter-latest-linux-amd64 > ~/tmp/cc-test-reporter
chmod +x ~/tmp/cc-test-reporter
- persist_to_workspace:
root: ~/tmp
paths:
- cc-test-reporter
# verify swagger specification
# Swagger verification
- run:
name: Verify swagger API specification
command: |
@@ -104,45 +103,62 @@ jobs:
curl -L https://repo1.maven.org/maven2/org/openapitools/openapi-generator-cli/6.3.0/openapi-generator-cli-6.3.0.jar > ~/tmp/openapi-generator-cli-6.3.0.jar
java -jar ~/tmp/openapi-generator-cli-6.3.0.jar validate -i swagger/swagger.json
# Database setup
- run: bundle exec rake db:create
- run: bundle exec rake db:schema:load
# we remove the FRONTED_URL from the .env before running the tests
- run:
name: Database Setup and Configure Environment Variables
command: |
pg_pass=$(head /dev/urandom | tr -dc A-Za-z0-9 | head -c 15 ; echo '')
sed -i "s/REPLACE_WITH_PASSWORD/${pg_pass}/g" ${PWD}/.circleci/setup_chatwoot.sql
chmod 644 ${PWD}/.circleci/setup_chatwoot.sql
mv ${PWD}/.circleci/setup_chatwoot.sql /tmp/
sudo -i -u postgres psql -f /tmp/setup_chatwoot.sql
cp .env.example .env
sed -i '/^FRONTEND_URL/d' .env
sed -i -e '/REDIS_URL/ s/=.*/=redis:\/\/localhost:6379/' .env
sed -i -e '/POSTGRES_HOST/ s/=.*/=localhost/' .env
sed -i -e '/POSTGRES_USERNAME/ s/=.*/=chatwoot/' .env
sed -i -e "/POSTGRES_PASSWORD/ s/=.*/=$pg_pass/" .env
echo -en "\nINSTALLATION_ENV=circleci" >> ".env"
# Database setup
- run:
name: Run DB migrations
command: bundle exec rails db:chatwoot_prepare
# Bundle audit
- run:
name: Bundle audit
command: bundle exec bundle audit update && bundle exec bundle audit check -v
# Rubocop linting
- run:
name: Rubocop
command: bundle exec rubocop
# - run:
# name: Brakeman
# command: bundle exec brakeman
# ESLint linting
- run:
name: eslint
command: yarn run eslint
command: pnpm run eslint
# Run frontend tests
- run:
name: Run frontend tests
command: |
mkdir -p ~/tmp/test-results/frontend_specs
mkdir -p ~/build/coverage/frontend
~/tmp/cc-test-reporter before-build
yarn test:coverage
- run:
name: Code Climate Test Coverage
command: |
~/tmp/cc-test-reporter format-coverage -t lcov -o "coverage/codeclimate.frontend_$CIRCLE_NODE_INDEX.json"
pnpm run test:coverage
# Run rails tests
- run:
name: Code Climate Test Coverage (Frontend)
command: |
~/tmp/cc-test-reporter format-coverage -t lcov -o "~/build/coverage/frontend/codeclimate.frontend_$CIRCLE_NODE_INDEX.json"
# Run backend tests
- run:
name: Run backend tests
command: |
mkdir -p ~/tmp/test-results/rspec
mkdir -p ~/tmp/test-artifacts
mkdir -p coverage
mkdir -p ~/build/coverage/backend
~/tmp/cc-test-reporter before-build
TESTFILES=$(circleci tests glob "spec/**/*_spec.rb" | circleci tests split --split-by=timings)
bundle exec rspec --format progress \
@@ -150,54 +166,18 @@ jobs:
--out ~/tmp/test-results/rspec.xml \
-- ${TESTFILES}
no_output_timeout: 30m
- run:
name: Code Climate Test Coverage
name: Code Climate Test Coverage (Backend)
command: |
~/tmp/cc-test-reporter format-coverage -t simplecov -o "coverage/codeclimate.$CIRCLE_NODE_INDEX.json"
~/tmp/cc-test-reporter format-coverage -t simplecov -o "~/build/coverage/backend/codeclimate.$CIRCLE_NODE_INDEX.json"
- run:
name: List coverage directory contents
command: |
ls -R ~/build/coverage
- persist_to_workspace:
root: coverage
root: ~/build
paths:
- codeclimate.*.json
# collect reports
- store_test_results:
path: ~/tmp/test-results
- store_artifacts:
path: ~/tmp/test-artifacts
- store_artifacts:
path: log
upload-coverage:
working_directory: ~/build
docker:
# specify the version you desire here
- image: circleci/ruby:3.0.2-node-browsers
environment:
- CC_TEST_REPORTER_ID: caf26a895e937974a90860cfadfded20891cfd1373a5aaafb3f67406ab9d433f
steps:
- attach_workspace:
at: ~/build
- run:
name: Download cc-test-reporter
command: |
mkdir -p ~/tmp
curl -L https://codeclimate.com/downloads/test-reporter/test-reporter-latest-linux-amd64 > ~/tmp/cc-test-reporter
chmod +x ~/tmp/cc-test-reporter
- persist_to_workspace:
root: ~/tmp
paths:
- cc-test-reporter
- run:
name: Upload coverage results to Code Climate
command: |
~/tmp/cc-test-reporter sum-coverage --output - codeclimate.*.json | ~/tmp/cc-test-reporter upload-coverage --debug --input -
workflows:
version: 2
commit:
jobs:
- build
- upload-coverage:
requires:
- build
- coverage

11
.circleci/setup_chatwoot.sql Normal file
View File

@@ -0,0 +1,11 @@
CREATE USER chatwoot CREATEDB;
ALTER USER chatwoot PASSWORD 'REPLACE_WITH_PASSWORD';
ALTER ROLE chatwoot SUPERUSER;
UPDATE pg_database SET datistemplate = FALSE WHERE datname = 'template1';
DROP DATABASE template1;
CREATE DATABASE template1 WITH TEMPLATE = template0 ENCODING = 'UNICODE';
UPDATE pg_database SET datistemplate = TRUE WHERE datname = 'template1';
\c template1;
VACUUM FREEZE;

3
.codeclimate.yml
View File

@@ -27,7 +27,8 @@ checks:
threshold: 50
exclude_patterns:
- 'spec/'
- '**/specs/'
- '**/specs/**/**'
- '**/spec/**/**'
- 'db/*'
- 'bin/**/*'
- 'db/**/*'

25
.eslintrc.js
View File

@@ -1,6 +1,23 @@
module.exports = {
extends: ['airbnb-base/legacy', 'prettier', 'plugin:vue/vue3-recommended'],
extends: [
'airbnb-base/legacy',
'prettier',
'plugin:vue/vue3-recommended',
'plugin:vitest-globals/recommended',
],
overrides: [
{
files: ['**/*.spec.{j,t}s?(x)'],
env: {
'vitest-globals/env': true,
},
},
],
plugins: ['html', 'prettier'],
parserOptions: {
ecmaVersion: 'latest',
sourceType: 'module',
},
rules: {
'prettier/prettier': ['error'],
camelcase: 'off',
@@ -206,5 +223,11 @@ module.exports = {
globals: {
bus: true,
vi: true,
// beforeEach: true,
// afterEach: true,
// test: true,
// describe: true,
// it: true,
// expect: true,
},
};

43
.github/workflows/frontend-fe.yml vendored Normal file
View File

@@ -0,0 +1,43 @@
name: Frontend Lint & Test
on:
push:
branches:
- develop
pull_request:
branches:
- develop
jobs:
test:
runs-on: ubuntu-20.04
steps:
- uses: actions/checkout@v4
with:
ref: ${{ github.event.pull_request.head.ref }}
repository: ${{ github.event.pull_request.head.repo.full_name }}
- uses: ruby/setup-ruby@v1
with:
bundler-cache: true
- uses: pnpm/action-setup@v4
with:
version: 9.3.0
- uses: actions/setup-node@v4
with:
node-version: 20
cache: 'pnpm'
- name: Install pnpm dependencies
run: pnpm install --frozen-lockfile
- name: Run eslint
run: pnpm run eslint
- name: Run frontend tests with coverage
run: |
mkdir -p coverage
pnpm run test:coverage

75
.github/workflows/run_foss_spec.yml vendored
View File

@@ -21,7 +21,7 @@ jobs:
image: postgres:15.3
env:
POSTGRES_USER: postgres
POSTGRES_PASSWORD: ""
POSTGRES_PASSWORD: ''
POSTGRES_DB: postgres
POSTGRES_HOST_AUTH_METHOD: trust
ports:
@@ -41,46 +41,49 @@ jobs:
options: --entrypoint redis-server
steps:
- uses: actions/checkout@v4
- uses: pnpm/action-setup@v4
with:
version: 9
ref: ${{ github.event.pull_request.head.ref }}
repository: ${{ github.event.pull_request.head.repo.full_name }}
- uses: actions/checkout@v4
- uses: pnpm/action-setup@v4
with:
version: 9
ref: ${{ github.event.pull_request.head.ref }}
repository: ${{ github.event.pull_request.head.repo.full_name }}
- uses: ruby/setup-ruby@v1
with:
bundler-cache: true # runs 'bundle install' and caches installed gems automatically
- uses: ruby/setup-ruby@v1
with:
bundler-cache: true # runs 'bundle install' and caches installed gems automatically
- uses: actions/setup-node@v4
with:
node-version: 20
cache: 'pnpm'
- uses: actions/setup-node@v4
with:
node-version: 20
cache: 'pnpm'
- name: Install pnpm dependencies
run: pnpm i
- name: Install pnpm dependencies
run: pnpm i
- name: Strip enterprise code
run: |
rm -rf enterprise
rm -rf spec/enterprise
- name: Strip enterprise code
run: |
rm -rf enterprise
rm -rf spec/enterprise
- name: Create database
run: bundle exec rake db:create
- name: Create database
run: bundle exec rake db:create
- name: Seed database
run: bundle exec rake db:schema:load
- name: Seed database
run: bundle exec rake db:schema:load
# Run rails tests
- name: Run backend tests
run: |
bundle exec rspec --profile=10 --format documentation
env:
NODE_OPTIONS: --openssl-legacy-provider
- name: Run frontend tests
run: pnpm run test:coverage
- name: Upload rails log folder
uses: actions/upload-artifact@v4
if: always()
with:
name: rails-log-folder
path: log
# Run rails tests
- name: Run backend tests
run: |
bundle exec rspec --profile=10 --format documentation
env:
NODE_OPTIONS: --openssl-legacy-provider
- name: Upload rails log folder
uses: actions/upload-artifact@v4
if: always()
with:
name: rails-log-folder
path: log

4
app/javascript/dashboard/components/ModalHeader.vue
View File

@@ -27,14 +27,14 @@ export default {
<div class="flex flex-col items-start px-8 pt-8 pb-0">
<img v-if="headerImage" :src="headerImage" alt="No image" />
<h2
ref="modalHeaderTitle"
data-test-id="modal-header-title"
class="text-base font-semibold leading-6 text-slate-800 dark:text-slate-50"
>
{{ headerTitle }}
</h2>
<p
v-if="headerContent"
ref="modalHeaderContent"
data-test-id="modal-header-content"
class="w-full mt-2 text-sm leading-5 break-words text-slate-600 dark:text-slate-300"
>
{{ headerContent }}

2
app/javascript/dashboard/components/layout/AvailabilityStatus.vue
View File

@@ -105,7 +105,7 @@ export default {
size="small"
:color-scheme="status.disabled ? '' : 'secondary'"
:variant="status.disabled ? 'smooth' : 'clear'"
class-names="status-change--dropdown-button"
class="status-change--dropdown-button"
@click="changeAvailabilityStatus(status.value)"
>
<AvailabilityStatusBadge :status="status.value" />

101
app/javascript/dashboard/components/layout/sidebarComponents/specs/AccountSelector.spec.js
View File

@@ -1,79 +1,62 @@
import { mount } from '@vue/test-utils';
import { createStore } from 'vuex';
import AccountSelector from '../AccountSelector.vue';
import { createLocalVue, mount } from '@vue/test-utils';
import Vuex from 'vuex';
import VueI18n from 'vue-i18n';
import i18n from 'dashboard/i18n';
import WootModal from 'dashboard/components/Modal.vue';
import WootModalHeader from 'dashboard/components/ModalHeader.vue';
import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
const localVue = createLocalVue();
localVue.component('woot-modal', WootModal);
localVue.component('woot-modal-header', WootModalHeader);
localVue.component('fluent-icon', FluentIcon);
localVue.use(Vuex);
localVue.use(VueI18n);
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
const store = createStore({
modules: {
auth: {
namespaced: false,
getters: {
getCurrentAccountId: () => 1,
getCurrentUser: () => ({
accounts: [
{ id: 1, name: 'Chatwoot', role: 'administrator' },
{ id: 2, name: 'GitX', role: 'agent' },
],
}),
},
},
globalConfig: {
namespaced: true,
getters: {
get: () => ({ createNewAccountFromDashboard: false }),
},
},
},
});
describe('accountSelctor', () => {
describe('AccountSelector', () => {
let accountSelector = null;
const currentUser = {
accounts: [
{
id: 1,
name: 'Chatwoot',
role: 'administrator',
},
{
id: 2,
name: 'GitX',
role: 'agent',
},
],
};
let actions = null;
let modules = null;
beforeEach(() => {
actions = {};
modules = {
auth: {
getters: {
getCurrentAccountId: () => 1,
getCurrentUser: () => currentUser,
},
},
globalConfig: {
getters: {
'globalConfig/get': () => ({ createNewAccountFromDashboard: false }),
},
},
};
let store = new Vuex.Store({ actions, modules });
accountSelector = mount(AccountSelector, {
store,
localVue,
i18n: i18nConfig,
propsData: { showAccountModal: true },
stubs: { WootButton: { template: '<button />' } },
global: {
plugins: [store],
components: {
'woot-modal': WootModal,
'woot-modal-header': WootModalHeader,
'fluent-icon': FluentIcon,
},
stubs: {
WootButton: { template: '<button />' },
// override global stub
WootModalHeader: false,
},
},
props: { showAccountModal: true },
});
});
it('title and sub title exist', () => {
const headerComponent = accountSelector.findComponent(WootModalHeader);
const title = headerComponent.findComponent({ ref: 'modalHeaderTitle' });
const title = headerComponent.find('[data-test-id="modal-header-title"]');
expect(title.text()).toBe('Switch Account');
const content = headerComponent.findComponent({
ref: 'modalHeaderContent',
});
const content = headerComponent.find(
'[data-test-id="modal-header-content"]'
);
expect(content.text()).toBe('Select an account from the following list');
});

72
app/javascript/dashboard/components/layout/sidebarComponents/specs/AgentDetails.spec.js
View File

@@ -1,27 +1,10 @@
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import AgentDetails from '../AgentDetails.vue';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import Vuex from 'vuex';
import VueI18n from 'vue-i18n';
import i18n from 'dashboard/i18n';
import Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';
import WootButton from 'dashboard/components/ui/WootButton.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
localVue.use(VueI18n);
localVue.component('thumbnail', Thumbnail);
localVue.component('woot-button', WootButton);
localVue.component('woot-button', WootButton);
localVue.use(VTooltip, {
defaultHtml: false,
});
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
});
describe('agentDetails', () => {
describe('AgentDetails', () => {
const currentUser = {
name: 'Neymar Junior',
avatar_url: '',
@@ -29,37 +12,46 @@ describe('agentDetails', () => {
};
const currentRole = 'agent';
let store = null;
let actions = null;
let modules = null;
let agentDetails = null;
beforeEach(() => {
actions = {};
const mockTooltipDirective = {
mounted: (el, binding) => {
// You can mock the behavior here if necessary
el.setAttribute('data-tooltip', binding.value || '');
},
};
modules = {
auth: {
getters: {
getCurrentUser: () => currentUser,
getCurrentRole: () => currentRole,
getCurrentUserAvailability: () => currentUser.availability_status,
beforeEach(() => {
store = createStore({
modules: {
auth: {
namespaced: false,
getters: {
getCurrentUser: () => currentUser,
getCurrentRole: () => currentRole,
getCurrentUserAvailability: () => currentUser.availability_status,
},
},
},
};
store = new Vuex.Store({
actions,
modules,
});
agentDetails = shallowMount(AgentDetails, {
store,
localVue,
i18n: i18nConfig,
global: {
plugins: [store],
components: {
Thumbnail,
WootButton,
},
directives: {
tooltip: mockTooltipDirective, // Mocking the tooltip directive
},
stubs: { WootButton: { template: '<button><slot /></button>' } },
},
});
});
it(' the agent status', () => {
expect(agentDetails.find('thumbnail-stub').vm.status).toBe('online');
it('shows the correct agent status', () => {
expect(agentDetails.findComponent(Thumbnail).vm.status).toBe('online');
});
it('agent thumbnail exists', () => {

66
app/javascript/dashboard/components/layout/sidebarComponents/specs/NotificationBell.spec.js
View File

@@ -1,20 +1,7 @@
import NotificationBell from '../NotificationBell.vue';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import Vuex from 'vuex';
import VueI18n from 'vue-i18n';
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
import i18n from 'dashboard/i18n';
const localVue = createLocalVue();
localVue.use(Vuex);
localVue.use(VueI18n);
localVue.component('fluent-icon', FluentIcon);
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
});
import NotificationBell from '../NotificationBell.vue';
const $route = {
name: 'notifications_index',
@@ -33,43 +20,51 @@ describe('notificationBell', () => {
};
modules = {
auth: {
namespaced: false,
getters: {
getCurrentAccountId: () => accountId,
},
},
notifications: {
namespaced: false,
getters: {
'notifications/getMeta': () => notificationMetadata,
},
},
};
store = new Vuex.Store({
store = createStore({
actions,
modules,
});
});
it('it should return unread count 19 ', () => {
it('it should return unread count 19', () => {
const wrapper = shallowMount(NotificationBell, {
localVue,
i18n: i18nConfig,
store,
mocks: {
$route,
global: {
plugins: [store],
mocks: {
$route,
},
components: {
'fluent-icon': FluentIcon,
},
},
});
expect(wrapper.vm.unreadCount).toBe('19');
});
it('it should return unread count 99+ ', async () => {
it('it should return unread count 99+', async () => {
notificationMetadata.unreadCount = 100;
const wrapper = shallowMount(NotificationBell, {
localVue,
i18n: i18nConfig,
store,
mocks: {
$route,
global: {
plugins: [store],
mocks: {
$route,
},
components: {
'fluent-icon': FluentIcon,
},
},
});
expect(wrapper.vm.unreadCount).toBe('99+');
@@ -77,11 +72,14 @@ describe('notificationBell', () => {
it('isNotificationPanelActive', async () => {
const notificationBell = shallowMount(NotificationBell, {
store,
localVue,
i18n: i18nConfig,
mocks: {
$route,
global: {
plugins: [store],
mocks: {
$route,
},
components: {
'fluent-icon': FluentIcon,
},
},
});

95
app/javascript/dashboard/components/layout/specs/AvailabilityStatus.spec.js
View File

@@ -1,9 +1,6 @@
import { mount } from '@vue/test-utils';
import { createStore } from 'vuex';
import AvailabilityStatus from '../AvailabilityStatus.vue';
import { createLocalVue, mount } from '@vue/test-utils';
import Vuex from 'vuex';
import VueI18n from 'vue-i18n';
import FloatingVue from 'floating-vue';
import WootButton from 'dashboard/components/ui/WootButton.vue';
import WootDropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
import WootDropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';
@@ -11,70 +8,64 @@ import WootDropdownHeader from 'shared/components/ui/dropdown/DropdownHeader.vue
import WootDropdownDivider from 'shared/components/ui/dropdown/DropdownDivider.vue';
import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
import i18n from 'dashboard/i18n';
const localVue = createLocalVue();
localVue.use(FloatingVue, {
html: false,
});
localVue.use(Vuex);
localVue.use(VueI18n);
localVue.component('woot-button', WootButton);
localVue.component('woot-dropdown-header', WootDropdownHeader);
localVue.component('woot-dropdown-menu', WootDropdownMenu);
localVue.component('woot-dropdown-divider', WootDropdownDivider);
localVue.component('woot-dropdown-item', WootDropdownItem);
localVue.component('fluent-icon', FluentIcon);
const i18nConfig = new VueI18n({ locale: 'en', messages: i18n });
describe('AvailabilityStatus', () => {
const currentAvailability = 'online';
const currentAccountId = '1';
const currentUserAutoOffline = false;
let store = null;
let actions = null;
let modules = null;
let availabilityStatus = null;
beforeEach(() => {
actions = {
updateAvailability: vi.fn(() => {
return Promise.resolve();
}),
updateAvailability: vi.fn(() => Promise.resolve()),
};
modules = {
auth: {
getters: {
getCurrentUserAvailability: () => currentAvailability,
getCurrentAccountId: () => currentAccountId,
getCurrentUserAutoOffline: () => currentUserAutoOffline,
store = createStore({
modules: {
auth: {
namespaced: false,
getters: {
getCurrentUserAvailability: () => currentAvailability,
getCurrentAccountId: () => currentAccountId,
getCurrentUserAutoOffline: () => currentUserAutoOffline,
},
},
},
};
store = new Vuex.Store({ actions, modules });
availabilityStatus = mount(AvailabilityStatus, {
store,
localVue,
i18n: i18nConfig,
stubs: { WootSwitch: { template: '<button />' } },
actions,
});
});
it('dispatches an action when user changes status', async () => {
await availabilityStatus;
availabilityStatus
.findAll('.status-change--dropdown-button')
.at(2)
.trigger('click');
const wrapper = mount(AvailabilityStatus, {
global: {
plugins: [store],
components: {
WootButton,
WootDropdownItem,
WootDropdownMenu,
WootDropdownHeader,
WootDropdownDivider,
FluentIcon,
},
stubs: {
WootSwitch: { template: '<button />' },
},
},
});
expect(actions.updateAvailability).toBeCalledWith(
expect.any(Object),
{ availability: 'offline', account_id: currentAccountId },
undefined
);
// Ensure that the dropdown menu is opened
await wrapper.vm.openStatusMenu();
// Simulate the user clicking the 3rd button (offline status)
const buttons = wrapper.findAll('.status-change--dropdown-button');
expect(buttons.length).toBeGreaterThan(0); // Ensure buttons exist
await buttons[2].trigger('click');
expect(actions.updateAvailability).toHaveBeenCalledTimes(1);
expect(actions.updateAvailability.mock.calls[0][1]).toEqual({
availability: 'offline',
account_id: currentAccountId,
});
});
});

5
app/javascript/dashboard/components/specs/__snapshots__/SidemenuIcon.spec.js.snap
View File

@@ -7,5 +7,8 @@ exports[`SidemenuIcon > matches snapshot 1`] = `
icon="list"
size="small"
variant="clear"
/>
>
</button>
`;

3
app/javascript/dashboard/components/widgets/WootWriter/utils/mp3ConversionUtils.js
View File

@@ -1,6 +1,7 @@
import lamejs from '@breezystack/lamejs';
const writeString = (view, offset, string) => {
// eslint-disable-next-line no-plusplus
for (let i = 0; i < string.length; i++) {
view.setUint8(offset + i, string.charCodeAt(i));
}
@@ -28,7 +29,9 @@ const bufferToWav = async (buffer, numChannels, sampleRate) => {
// WAV Data
const offset = 44;
// eslint-disable-next-line no-plusplus
for (let i = 0; i < buffer.length; i++) {
// eslint-disable-next-line no-plusplus
for (let channel = 0; channel < numChannels; channel++) {
const sample = Math.max(
-1,

1
app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
View File

@@ -478,6 +478,7 @@ export default {
</div>
<ul class="conversation-panel">
<transition name="slide-up">
<!-- eslint-disable-next-line vue/require-toggle-inside-transition -->
<li class="min-h-[4rem]">
<span v-if="shouldShowSpinner" class="spinner message" />
</li>

108
app/javascript/dashboard/components/widgets/conversation/specs/MoreActions.spec.js
View File

@@ -1,11 +1,7 @@
import { createLocalVue, mount } from '@vue/test-utils';
import Vuex from 'vuex';
import VueI18n from 'vue-i18n';
import FloatingVue from 'floating-vue';
import Button from 'dashboard/components/buttons/Button.vue';
import i18n from 'dashboard/i18n';
import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
import { mount } from '@vue/test-utils';
import { createStore } from 'vuex';
import MoreActions from '../MoreActions.vue';
import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
vi.mock('shared/helpers/mitt', () => ({
emitter: {
@@ -15,75 +11,67 @@ vi.mock('shared/helpers/mitt', () => ({
},
}));
import { emitter } from 'shared/helpers/mitt';
const localVue = createLocalVue();
localVue.use(Vuex);
localVue.use(VueI18n);
localVue.use(FloatingVue);
localVue.component('fluent-icon', FluentIcon);
localVue.component('woot-button', Button);
localVue.prototype.$emitter = {
emit: vi.fn(),
on: vi.fn(),
off: vi.fn(),
const mockDirective = {
mounted: () => {},
};
const i18nConfig = new VueI18n({ locale: 'en', messages: i18n });
import { emitter } from 'shared/helpers/mitt';
describe('MoveActions', () => {
let currentChat = { id: 8, muted: false };
let state = null;
let store = null;
let muteConversation = null;
let unmuteConversation = null;
let modules = null;
let getters = null;
let store = null;
let moreActions = null;
beforeEach(() => {
state = {
authenticated: true,
currentChat,
};
muteConversation = vi.fn(() => Promise.resolve());
unmuteConversation = vi.fn(() => Promise.resolve());
modules = {
conversations: { actions: { muteConversation, unmuteConversation } },
};
getters = { getSelectedChat: () => currentChat };
store = new Vuex.Store({ state, modules, getters });
moreActions = mount(MoreActions, {
store,
localVue,
i18n: i18nConfig,
stubs: {
WootModal: { template: '<div><slot/> </div>' },
WootModalHeader: { template: '<div><slot/> </div>' },
store = createStore({
state: {
authenticated: true,
currentChat,
},
getters: {
getSelectedChat: () => currentChat,
},
modules: {
conversations: {
namespaced: false,
actions: { muteConversation, unmuteConversation },
},
},
});
});
const createWrapper = () =>
mount(MoreActions, {
global: {
plugins: [store],
components: {
'fluent-icon': FluentIcon,
},
directives: {
'on-clickaway': mockDirective,
},
},
});
describe('muting discussion', () => {
it('triggers "muteConversation"', async () => {
await moreActions.find('button:first-child').trigger('click');
const wrapper = createWrapper();
await wrapper.find('button:first-child').trigger('click');
expect(muteConversation).toBeCalledWith(
expect.any(Object),
currentChat.id,
undefined
expect(muteConversation).toHaveBeenCalledTimes(1);
expect(muteConversation).toHaveBeenCalledWith(
expect.any(Object), // First argument is the Vuex context object
currentChat.id // Second argument is the ID of the conversation
);
});
it('shows alert', async () => {
await moreActions.find('button:first-child').trigger('click');
const wrapper = createWrapper();
await wrapper.find('button:first-child').trigger('click');
expect(emitter.emit).toBeCalledWith('newToastMessage', {
message:
@@ -99,17 +87,19 @@ describe('MoveActions', () => {
});
it('triggers "unmuteConversation"', async () => {
await moreActions.find('button:first-child').trigger('click');
const wrapper = createWrapper();
await wrapper.find('button:first-child').trigger('click');
expect(unmuteConversation).toBeCalledWith(
expect.any(Object),
currentChat.id,
undefined
expect(unmuteConversation).toHaveBeenCalledTimes(1);
expect(unmuteConversation).toHaveBeenCalledWith(
expect.any(Object), // First argument is the Vuex context object
currentChat.id // Second argument is the ID of the conversation
);
});
it('shows alert', async () => {
await moreActions.find('button:first-child').trigger('click');
const wrapper = createWrapper();
await wrapper.find('button:first-child').trigger('click');
expect(emitter.emit).toBeCalledWith('newToastMessage', {
message: 'This contact is unblocked successfully.',

2
app/javascript/dashboard/composables/index.js
View File

@@ -1,5 +1,5 @@
import { emitter } from 'shared/helpers/mitt';
import analyticsHelper from '/dashboard/helper/AnalyticsHelper/index';
import analyticsHelper from 'dashboard/helper/AnalyticsHelper/index';
/**
* Custom hook to track events

34
app/javascript/dashboard/composables/spec/emitter.spec.js
View File

@@ -1,6 +1,7 @@
import { shallowMount } from '@vue/test-utils';
import { emitter } from 'shared/helpers/mitt';
import { useEmitter } from '../emitter';
import { defineComponent } from 'vue';
vi.mock('shared/helpers/mitt', () => ({
emitter: {
@@ -10,31 +11,34 @@ vi.mock('shared/helpers/mitt', () => ({
}));
describe('useEmitter', () => {
let wrapper;
const eventName = 'my-event';
const callback = vi.fn();
let wrapper;
const TestComponent = defineComponent({
setup() {
return {
cleanup: useEmitter(eventName, callback),
};
},
template: '<div>Hello world</div>',
});
beforeEach(() => {
wrapper = shallowMount({
template: `
<div>
Hello world
</div>
`,
setup() {
return {
cleanup: useEmitter(eventName, callback),
};
},
});
wrapper = shallowMount(TestComponent);
});
afterEach(() => {
vi.clearAllMocks();
});
it('should add an event listener on mount', () => {
expect(emitter.on).toHaveBeenCalledWith(eventName, callback);
});
it('should remove the event listener when the component is unmounted', () => {
wrapper.destroy();
it('should remove the event listener when the component is unmounted', async () => {
await wrapper.unmount();
expect(emitter.off).toHaveBeenCalledWith(eventName, callback);
});

20
app/javascript/dashboard/composables/spec/index.spec.js
View File

@@ -1,20 +1,26 @@
import { getCurrentInstance } from 'vue';
import { emitter } from 'shared/helpers/mitt';
import analyticsHelper from 'dashboard/helper/AnalyticsHelper';
import { useTrack, useAlert } from '../index';
vi.mock('vue', () => ({
getCurrentInstance: vi.fn(),
}));
vi.mock('shared/helpers/mitt', () => ({
emitter: {
emit: vi.fn(),
},
}));
vi.mock('dashboard/helper/AnalyticsHelper/index', async importOriginal => {
const actual = await importOriginal();
actual.default = {
track: vi.fn(),
};
return actual;
});
describe('useTrack', () => {
it('should return a function', () => {
const track = useTrack();
expect(typeof track).toBe('function');
it('should call analyticsHelper.track and return a function', () => {
const eventArgs = ['event-name', { some: 'data' }];
useTrack(...eventArgs);
expect(analyticsHelper.track).toHaveBeenCalledWith(...eventArgs);
});
});

17
app/javascript/dashboard/composables/spec/useAI.spec.js
View File

@@ -4,14 +4,20 @@ import {
useStoreGetters,
useMapGetter,
} from 'dashboard/composables/store';
import { useAlert, useTrack } from 'dashboard/composables';
import { useI18n } from 'vue-i18n';
import OpenAPI from 'dashboard/api/integrations/openapi';
import analyticsHelper from 'dashboard/helper/AnalyticsHelper/index';
vi.mock('dashboard/composables/store');
vi.mock('dashboard/composables');
vi.mock('vue-i18n');
vi.mock('dashboard/api/integrations/openapi');
vi.mock('dashboard/helper/AnalyticsHelper/index', async importOriginal => {
const actual = await importOriginal();
actual.default = {
track: vi.fn(),
};
return actual;
});
vi.mock('dashboard/helper/AnalyticsHelper/events', () => ({
OPEN_AI_EVENTS: {
TEST_EVENT: 'open_ai_test_event',
@@ -40,9 +46,7 @@ describe('useAI', () => {
};
return { value: mockValues[getter] };
});
useTrack.mockReturnValue(vi.fn());
useI18n.mockReturnValue({ t: vi.fn() });
useAlert.mockReturnValue(vi.fn());
});
it('initializes computed properties correctly', async () => {
@@ -78,13 +82,12 @@ describe('useAI', () => {
});
it('records analytics correctly', async () => {
const mockTrack = vi.fn();
useTrack.mockReturnValue(mockTrack);
// const mockTrack = analyticsHelper.track;
const { recordAnalytics } = useAI();
await recordAnalytics('TEST_EVENT', { data: 'test' });
expect(mockTrack).toHaveBeenCalledWith('open_ai_test_event', {
expect(analyticsHelper.track).toHaveBeenCalledWith('open_ai_test_event', {
type: 'TEST_EVENT',
data: 'test',
});

119
app/javascript/dashboard/composables/spec/useAutomation.spec.js
View File

@@ -1,7 +1,7 @@
import { useAutomation } from '../useAutomation';
import { useStoreGetters, useMapGetter } from 'dashboard/composables/store';
import { useAlert } from 'dashboard/composables';
import { useI18n } from '../useI18n';
import { useI18n } from 'vue-i18n';
import * as automationHelper from 'dashboard/helper/automationHelper';
import {
customAttributes,
@@ -20,7 +20,7 @@ import { MESSAGE_CONDITION_VALUES } from 'dashboard/constants/automation';
vi.mock('dashboard/composables/store');
vi.mock('dashboard/composables');
vi.mock('../useI18n');
vi.mock('vue-i18n');
vi.mock('dashboard/helper/automationHelper');
describe('useAutomation', () => {
@@ -120,8 +120,8 @@ describe('useAutomation', () => {
});
it('appends new condition and action correctly', () => {
const { appendNewCondition, appendNewAction } = useAutomation();
const mockAutomation = {
const { appendNewCondition, appendNewAction, automation } = useAutomation();
automation.value = {
event_name: 'message_created',
conditions: [],
actions: [],
@@ -130,36 +130,37 @@ describe('useAutomation', () => {
automationHelper.getDefaultConditions.mockReturnValue([{}]);
automationHelper.getDefaultActions.mockReturnValue([{}]);
appendNewCondition(mockAutomation);
appendNewAction(mockAutomation);
appendNewCondition();
appendNewAction();
expect(automationHelper.getDefaultConditions).toHaveBeenCalledWith(
'message_created'
);
expect(automationHelper.getDefaultActions).toHaveBeenCalled();
expect(mockAutomation.conditions).toHaveLength(1);
expect(mockAutomation.actions).toHaveLength(1);
expect(automation.value.conditions).toHaveLength(1);
expect(automation.value.actions).toHaveLength(1);
});
it('removes filter and action correctly', () => {
const { removeFilter, removeAction } = useAutomation();
const mockAutomation = {
const { removeFilter, removeAction, automation } = useAutomation();
automation.value = {
conditions: [{ id: 1 }, { id: 2 }],
actions: [{ id: 1 }, { id: 2 }],
};
removeFilter(mockAutomation, 0);
removeAction(mockAutomation, 0);
removeFilter(0);
removeAction(0);
expect(mockAutomation.conditions).toHaveLength(1);
expect(mockAutomation.actions).toHaveLength(1);
expect(mockAutomation.conditions[0].id).toBe(2);
expect(mockAutomation.actions[0].id).toBe(2);
expect(automation.value.conditions).toHaveLength(1);
expect(automation.value.actions).toHaveLength(1);
expect(automation.value.conditions[0].id).toBe(2);
expect(automation.value.actions[0].id).toBe(2);
});
it('resets filter and action correctly', () => {
const { resetFilter, resetAction } = useAutomation();
const mockAutomation = {
const { resetFilter, resetAction, automation, automationTypes } =
useAutomation();
automation.value = {
event_name: 'message_created',
conditions: [
{
@@ -170,77 +171,37 @@ describe('useAutomation', () => {
],
actions: [{ action_name: 'assign_agent', action_params: [1] }],
};
const mockAutomationTypes = {
message_created: {
conditions: [
{ key: 'status', filterOperators: [{ value: 'not_equal_to' }] },
],
},
automationTypes.message_created = {
conditions: [
{ key: 'status', filterOperators: [{ value: 'not_equal_to' }] },
],
};
resetFilter(
mockAutomation,
mockAutomationTypes,
0,
mockAutomation.conditions[0]
);
resetAction(mockAutomation, 0);
resetFilter(0, automation.value.conditions[0]);
resetAction(0);
expect(mockAutomation.conditions[0].filter_operator).toBe('not_equal_to');
expect(mockAutomation.conditions[0].values).toBe('');
expect(mockAutomation.actions[0].action_params).toEqual([]);
});
it('formats automation correctly', () => {
const { formatAutomation } = useAutomation();
const mockAutomation = {
conditions: [{ attribute_key: 'status', values: ['open'] }],
actions: [{ action_name: 'assign_agent', action_params: [1] }],
};
const mockAutomationTypes = {};
const mockAutomationActionTypes = [
{ key: 'assign_agent', inputType: 'search_select' },
];
automationHelper.getConditionOptions.mockReturnValue([
{ id: 'open', name: 'open' },
]);
automationHelper.getActionOptions.mockReturnValue([
{ id: 1, name: 'Agent 1' },
]);
const result = formatAutomation(
mockAutomation,
customAttributes,
mockAutomationTypes,
mockAutomationActionTypes
);
expect(result.conditions[0].values).toEqual([{ id: 'open', name: 'open' }]);
expect(result.actions[0].action_params).toEqual([
{ id: 1, name: 'Agent 1' },
]);
expect(automation.value.conditions[0].filter_operator).toBe('not_equal_to');
expect(automation.value.conditions[0].values).toBe('');
expect(automation.value.actions[0].action_params).toEqual([]);
});
it('manifests custom attributes correctly', () => {
const { manifestCustomAttributes } = useAutomation();
const mockAutomationTypes = {
message_created: { conditions: [] },
conversation_created: { conditions: [] },
conversation_updated: { conditions: [] },
conversation_opened: { conditions: [] },
};
const { manifestCustomAttributes, automationTypes } = useAutomation();
automationTypes.message_created = { conditions: [] };
automationTypes.conversation_created = { conditions: [] };
automationTypes.conversation_updated = { conditions: [] };
automationTypes.conversation_opened = { conditions: [] };
automationHelper.generateCustomAttributeTypes.mockReturnValue([]);
automationHelper.generateCustomAttributes.mockReturnValue([]);
manifestCustomAttributes(mockAutomationTypes);
manifestCustomAttributes();
expect(automationHelper.generateCustomAttributeTypes).toHaveBeenCalledTimes(
2
);
expect(automationHelper.generateCustomAttributes).toHaveBeenCalledTimes(1);
Object.values(mockAutomationTypes).forEach(type => {
Object.values(automationTypes).forEach(type => {
expect(type.conditions).toHaveLength(0);
});
});
@@ -273,8 +234,8 @@ describe('useAutomation', () => {
});
it('handles event change correctly', () => {
const { onEventChange } = useAutomation();
const mockAutomation = {
const { onEventChange, automation } = useAutomation();
automation.value = {
event_name: 'message_created',
conditions: [],
actions: [],
@@ -283,13 +244,13 @@ describe('useAutomation', () => {
automationHelper.getDefaultConditions.mockReturnValue([{}]);
automationHelper.getDefaultActions.mockReturnValue([{}]);
onEventChange(mockAutomation);
onEventChange();
expect(automationHelper.getDefaultConditions).toHaveBeenCalledWith(
'message_created'
);
expect(automationHelper.getDefaultActions).toHaveBeenCalled();
expect(mockAutomation.conditions).toHaveLength(1);
expect(mockAutomation.actions).toHaveLength(1);
expect(automation.value.conditions).toHaveLength(1);
expect(automation.value.actions).toHaveLength(1);
});
});

36
app/javascript/dashboard/helper/AnalyticsHelper/specs/plugin.spec.js
View File

@@ -1,36 +0,0 @@
import Vue from 'vue';
import plugin from '../plugin';
import analyticsHelper from '../index';
vi.spyOn(analyticsHelper, 'init');
vi.spyOn(analyticsHelper, 'track');
describe('Vue Analytics Plugin', () => {
beforeEach(() => {
Vue.use(plugin);
});
it('should call the init method on analyticsHelper once during plugin installation', () => {
expect(analyticsHelper.init).toHaveBeenCalledTimes(1);
});
it('should add the analyticsHelper to the Vue prototype as $analytics', () => {
expect(Vue.prototype.$analytics).toBe(analyticsHelper);
});
it('should add a track method to the Vue prototype as $track', () => {
expect(typeof Vue.prototype.$track).toBe('function');
Vue.prototype.$track('eventName');
expect(analyticsHelper.track)
.toHaveBeenCalledTimes(1)
.toHaveBeenCalledWith('eventName');
});
it('should call the track method on analyticsHelper with the correct event name when $track is called', () => {
const eventName = 'testEvent';
Vue.prototype.$track(eventName);
expect(analyticsHelper.track)
.toHaveBeenCalledTimes(1)
.toHaveBeenCalledWith(eventName);
});
});

14
app/javascript/dashboard/helper/specs/ReconnectService.spec.js
View File

@@ -37,8 +37,10 @@ const storeMock = {
const routerMock = {
currentRoute: {
name: '',
params: { conversation_id: null },
value: {
name: '',
params: { conversation_id: null },
},
},
};
@@ -222,7 +224,7 @@ describe('ReconnectService', () => {
describe('fetchConversationMessagesOnReconnect', () => {
it('should dispatch syncActiveConversationMessages if conversationId exists', async () => {
routerMock.currentRoute.params.conversation_id = 1;
routerMock.currentRoute.value.params.conversation_id = 1;
await reconnectService.fetchConversationMessagesOnReconnect();
expect(storeMock.dispatch).toHaveBeenCalledWith(
'syncActiveConversationMessages',
@@ -231,7 +233,7 @@ describe('ReconnectService', () => {
});
it('should not dispatch syncActiveConversationMessages if conversationId does not exist', async () => {
routerMock.currentRoute.params.conversation_id = null;
routerMock.currentRoute.value.params.conversation_id = null;
await reconnectService.fetchConversationMessagesOnReconnect();
expect(storeMock.dispatch).not.toHaveBeenCalledWith(
'syncActiveConversationMessages',
@@ -305,7 +307,7 @@ describe('ReconnectService', () => {
describe('setConversationLastMessageId', () => {
it('should dispatch setConversationLastMessageId if conversationId exists', async () => {
routerMock.currentRoute.params.conversation_id = 1;
routerMock.currentRoute.value.params.conversation_id = 1;
await reconnectService.setConversationLastMessageId();
expect(storeMock.dispatch).toHaveBeenCalledWith(
'setConversationLastMessageId',
@@ -314,7 +316,7 @@ describe('ReconnectService', () => {
});
it('should not dispatch setConversationLastMessageId if conversationId does not exist', async () => {
routerMock.currentRoute.params.conversation_id = null;
routerMock.currentRoute.value.params.conversation_id = null;
await reconnectService.setConversationLastMessageId();
expect(storeMock.dispatch).not.toHaveBeenCalledWith(
'setConversationLastMessageId',

78
app/javascript/dashboard/helper/specs/directives/resize.spec.js
View File

@@ -1,78 +0,0 @@
import resize from '../../directives/resize';
class ResizeObserverMock {
// eslint-disable-next-line class-methods-use-this
observe() {}
// eslint-disable-next-line class-methods-use-this
unobserve() {}
// eslint-disable-next-line class-methods-use-this
disconnect() {}
}
describe('resize directive', () => {
let el;
let binding;
let observer;
beforeEach(() => {
el = document.createElement('div');
binding = {
value: vi.fn(),
};
observer = {
observe: vi.fn(),
unobserve: vi.fn(),
disconnect: vi.fn(),
};
window.ResizeObserver = ResizeObserverMock;
vi.spyOn(window, 'ResizeObserver').mockImplementation(() => observer);
});
afterEach(() => {
vi.clearAllMocks();
});
it('should create ResizeObserver on bind', () => {
resize.bind(el, binding);
expect(ResizeObserver).toHaveBeenCalled();
expect(observer.observe).toHaveBeenCalledWith(el);
});
it('should call callback on observer callback', () => {
el = document.createElement('div');
binding = {
value: vi.fn(),
};
resize.bind(el, binding);
const entries = [{ contentRect: { width: 100, height: 100 } }];
const callback = binding.value;
callback(entries[0]);
expect(binding.value).toHaveBeenCalledWith(entries[0]);
});
it('should destroy and recreate observer on update', () => {
resize.bind(el, binding);
resize.update(el, { ...binding, oldValue: 'old' });
expect(observer.unobserve).toHaveBeenCalledWith(el);
expect(observer.disconnect).toHaveBeenCalled();
expect(ResizeObserver).toHaveBeenCalledTimes(2);
expect(observer.observe).toHaveBeenCalledTimes(2);
});
it('should destroy observer on unbind', () => {
resize.bind(el, binding);
resize.unbind(el);
expect(observer.unobserve).toHaveBeenCalledWith(el);
expect(observer.disconnect).toHaveBeenCalled();
});
});

4
app/javascript/dashboard/helper/specs/editorHelper.spec.js
View File

@@ -9,8 +9,8 @@ import {
findNodeToInsertImage,
setURLWithQueryAndSize,
} from '../editorHelper';
import { EditorState } from 'prosemirror-state';
import { EditorView } from 'prosemirror-view';
import { EditorState } from '@chatwoot/prosemirror-schema';
import { EditorView } from '@chatwoot/prosemirror-schema';
import { Schema } from 'prosemirror-model';
// Define a basic ProseMirror schema

71
app/javascript/dashboard/mixins/specs/fileUploadMixin.spec.js
View File

@@ -1,6 +1,8 @@
import Vue from 'vue';
import { shallowMount } from '@vue/test-utils';
import { useAlert } from 'dashboard/composables';
import fileUploadMixin from 'dashboard/mixins/fileUploadMixin';
import { checkFileSizeLimit } from 'shared/helpers/FileHelper';
import { reactive } from 'vue';
vi.mock('shared/helpers/FileHelper', () => ({
checkFileSizeLimit: vi.fn(),
@@ -17,61 +19,80 @@ vi.mock('dashboard/composables', () => ({
}));
describe('FileUploadMixin', () => {
let vm;
let wrapper;
let mockGlobalConfig;
let mockCurrentChat;
let mockCurrentUser;
beforeEach(() => {
vm = new Vue(fileUploadMixin);
vm.isATwilioSMSChannel = false;
vm.globalConfig = {
mockGlobalConfig = reactive({
directUploadsEnabled: true,
};
vm.accountId = 123;
vm.currentChat = {
});
mockCurrentChat = reactive({
id: 456,
};
vm.currentUser = {
});
mockCurrentUser = reactive({
access_token: 'token',
};
vm.$t = vi.fn(message => message);
vm.showAlert = vi.fn();
vm.attachFile = vi.fn();
});
wrapper = shallowMount({
mixins: [fileUploadMixin],
data() {
return {
globalConfig: mockGlobalConfig,
currentChat: mockCurrentChat,
currentUser: mockCurrentUser,
isATwilioSMSChannel: false,
};
},
methods: {
attachFile: vi.fn(),
showAlert: vi.fn(),
$t: msg => msg,
},
template: '<div />',
});
});
it('should call onDirectFileUpload when direct uploads are enabled', () => {
vm.onDirectFileUpload = vi.fn();
vm.onFileUpload({});
expect(vm.onDirectFileUpload).toHaveBeenCalledWith({});
wrapper.vm.onDirectFileUpload = vi.fn();
wrapper.vm.onFileUpload({});
expect(wrapper.vm.onDirectFileUpload).toHaveBeenCalledWith({});
});
it('should call onIndirectFileUpload when direct uploads are disabled', () => {
vm.globalConfig.directUploadsEnabled = false;
vm.onIndirectFileUpload = vi.fn();
vm.onFileUpload({});
expect(vm.onIndirectFileUpload).toHaveBeenCalledWith({});
wrapper.vm.globalConfig.directUploadsEnabled = false;
wrapper.vm.onIndirectFileUpload = vi.fn();
wrapper.vm.onFileUpload({});
expect(wrapper.vm.onIndirectFileUpload).toHaveBeenCalledWith({});
});
describe('onDirectFileUpload', () => {
it('returns early if no file is provided', () => {
const returnValue = vm.onDirectFileUpload(null);
const returnValue = wrapper.vm.onDirectFileUpload(null);
expect(returnValue).toBeUndefined();
});
it('shows an alert if the file size exceeds the maximum limit', () => {
const fakeFile = { size: 999999999 };
vm.onDirectFileUpload(fakeFile);
checkFileSizeLimit.mockReturnValue(false); // Mock exceeding file size
wrapper.vm.onDirectFileUpload(fakeFile);
expect(useAlert).toHaveBeenCalledWith(expect.any(String));
});
});
describe('onIndirectFileUpload', () => {
it('returns early if no file is provided', () => {
const returnValue = vm.onIndirectFileUpload(null);
const returnValue = wrapper.vm.onIndirectFileUpload(null);
expect(returnValue).toBeUndefined();
});
it('shows an alert if the file size exceeds the maximum limit', () => {
const fakeFile = { size: 999999999 };
vm.onIndirectFileUpload(fakeFile);
checkFileSizeLimit.mockReturnValue(false); // Mock exceeding file size
wrapper.vm.onIndirectFileUpload(fakeFile);
expect(useAlert).toHaveBeenCalledWith(expect.any(String));
});
});

42
app/javascript/dashboard/routes/dashboard/helpcenter/mixins/specs/portalMixin.spec.js
View File

@@ -1,16 +1,15 @@
import { shallowMount, createLocalVue } from '@vue/test-utils';
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import { createRouter, createWebHistory } from 'vue-router';
import portalMixin from '../portalMixin';
import Vuex from 'vuex';
import VueRouter from 'vue-router';
const localVue = createLocalVue();
localVue.use(Vuex);
localVue.use(VueRouter);
import ListAllArticles from '../../pages/portals/ListAllPortals.vue';
const router = new VueRouter({
// Create router instance
const router = createRouter({
history: createWebHistory(),
routes: [
{
path: ':portalSlug/:locale/articles',
path: '/:portalSlug/:locale/articles', // Add leading "/"
name: 'list_all_locale_articles',
component: ListAllArticles,
},
@@ -30,18 +29,21 @@ describe('portalMixin', () => {
render() {},
title: 'TestComponent',
mixins: [portalMixin],
router,
};
store = new Vuex.Store({ getters });
wrapper = shallowMount(Component, { store, localVue });
store = createStore({ getters });
wrapper = shallowMount(Component, {
global: {
plugins: [store, router],
},
});
});
it('return account id', () => {
it('returns account id', () => {
expect(wrapper.vm.accountId).toBe(1);
});
it('returns article url', () => {
router.push({
it('returns article url', async () => {
await router.push({
name: 'list_all_locale_articles',
params: { portalSlug: 'fur-rent', locale: 'en' },
});
@@ -50,24 +52,24 @@ describe('portalMixin', () => {
);
});
it('returns portal locale', () => {
router.push({
it('returns portal locale', async () => {
await router.push({
name: 'list_all_locale_articles',
params: { portalSlug: 'fur-rent', locale: 'es' },
});
expect(wrapper.vm.portalSlug).toBe('fur-rent');
});
it('returns portal slug', () => {
router.push({
it('returns portal slug', async () => {
await router.push({
name: 'list_all_locale_articles',
params: { portalSlug: 'campaign', locale: 'es' },
});
expect(wrapper.vm.portalSlug).toBe('campaign');
});
it('returns locale name', () => {
router.push({
it('returns locale name', async () => {
await router.push({
name: 'list_all_locale_articles',
params: { portalSlug: 'fur-rent', locale: 'es' },
});

1
app/javascript/dashboard/routes/dashboard/helpcenter/pages/articles/ArticleSettings.vue
View File

@@ -128,6 +128,7 @@ export default {
<template>
<transition name="popover-animation">
<!-- eslint-disable-next-line vue/require-toggle-inside-transition -->
<div
class="min-w-[15rem] max-w-[22.5rem] p-6 overflow-y-auto border-l rtl:border-r rtl:border-l-0 border-solid border-slate-50 dark:border-slate-700"
>

10
app/javascript/dashboard/routes/dashboard/settings/reports/components/ReportMetricCard.vue
View File

@@ -19,11 +19,9 @@ defineProps({
});
</script>
<!-- eslint-disable vue/no-unused-refs -->
<!-- Added ref for writing specs -->
<template>
<div
ref="reportMetricContainer"
data-test-id="reportMetricContainer"
class="p-4 m-0"
:class="{
'grayscale pointer-events-none opacity-30': disabled,
@@ -32,17 +30,17 @@ defineProps({
<h3
class="flex items-center m-0 text-sm font-medium text-slate-800 dark:text-slate-100"
>
<span ref="reportMetricLabel">{{ label }}</span>
<span data-test-id="reportMetricLabel">{{ label }}</span>
<fluent-icon
ref="reportMetricInfo"
v-tooltip="infoText"
data-test-id="reportMetricInfo"
size="14"
icon="info"
class="text-slate-500 dark:text-slate-200 my-0 mx-1 mt-0.5"
/>
</h3>
<h4
ref="reportMetricValue"
data-test-id="reportMetricValue"
class="mt-1 mb-0 text-3xl font-thin text-slate-700 dark:text-slate-100"
>
{{ value }}

45
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/CSATMetrics.spec.js
View File

@@ -1,17 +1,7 @@
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import CsatMetrics from '../CsatMetrics.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
const mountParams = {
mocks: {
$t: msg => msg,
},
stubs: ['csat-metric-card', 'woot-horizontal-bar'],
};
describe('CsatMetrics.vue', () => {
let getters;
let store;
@@ -21,20 +11,33 @@ describe('CsatMetrics.vue', () => {
beforeEach(() => {
getters = {
'csat/getMetrics': () => ({ totalResponseCount: 100 }),
'csat/getRatingPercentage': () => ({ 1: 10, 2: 20, 3: 30, 4: 30, 5: 10 }),
'csat/getRatingPercentage': () => ({
1: 10,
2: 20,
3: 30,
4: 30,
5: 10,
}),
'csat/getSatisfactionScore': () => 85,
'csat/getResponseRate': () => 90,
};
store = new Vuex.Store({
store = createStore({
getters,
});
wrapper = shallowMount(CsatMetrics, {
store,
localVue,
propsData: { filters },
...mountParams,
global: {
plugins: [store], // Ensure the store is injected here
mocks: {
$t: msg => msg, // mock translation function
},
stubs: {
CsatMetricCard: '<csat-metric-card/>',
BarChart: '<woot-horizontal-bar/>',
},
},
props: { filters },
});
});
@@ -54,13 +57,11 @@ describe('CsatMetrics.vue', () => {
});
it('hides report card if rating filter is enabled', () => {
expect(wrapper.find({ ref: 'csatHorizontalBarChart' }).exists()).toBe(
false
);
expect(wrapper.html()).not.toContain('bar-chart-stub');
});
it('shows report card if rating filter is not enabled', async () => {
await wrapper.setProps({ filters: {} });
expect(wrapper.find({ ref: 'csatHorizontalBarChart' }).exists()).toBe(true);
expect(wrapper.html()).toContain('bar-chart-stub');
});
});

26
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersAgents.spec.js
View File

@@ -1,11 +1,8 @@
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import ReportsFiltersAgents from '../../Filters/Agents.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
const mockStore = new Vuex.Store({
const mockStore = createStore({
modules: {
agents: {
namespaced: true,
@@ -23,25 +20,26 @@ const mockStore = new Vuex.Store({
});
const mountParams = {
localVue,
store: mockStore,
mocks: {
$t: msg => msg,
global: {
plugins: [mockStore],
mocks: {
$t: msg => msg,
},
stubs: ['multiselect'],
},
stubs: ['multiselect'],
};
describe('ReportsFiltersAgents.vue', () => {
it('emits "agents-filter-selection" event when handleInput is called', () => {
it('emits "agents-filter-selection" event when handleInput is called', async () => {
const wrapper = shallowMount(ReportsFiltersAgents, mountParams);
const selectedAgents = [
{ id: 1, name: 'Agent 1' },
{ id: 2, name: 'Agent 2' },
];
wrapper.setData({ selectedOptions: selectedAgents });
await wrapper.setData({ selectedOptions: selectedAgents });
wrapper.vm.handleInput();
await wrapper.vm.handleInput();
expect(wrapper.emitted('agentsFilterSelection')).toBeTruthy();
expect(wrapper.emitted('agentsFilterSelection')[0]).toEqual([

8
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateGroupBy.spec.js
View File

@@ -3,10 +3,12 @@ import ReportsFiltersDateGroupBy from '../../Filters/DateGroupBy.vue';
import { GROUP_BY_OPTIONS } from '../../../constants';
const mountParams = {
mocks: {
$t: msg => msg,
global: {
mocks: {
$t: msg => msg,
},
stubs: ['multiselect'],
},
stubs: ['multiselect'],
};
describe('ReportsFiltersDateGroupBy.vue', () => {

8
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateRange.spec.js
View File

@@ -3,10 +3,12 @@ import ReportFiltersDateRange from '../../Filters/DateRange.vue';
import { DATE_RANGE_OPTIONS } from '../../../constants';
const mountParams = {
mocks: {
$t: msg => msg,
global: {
mocks: {
$t: msg => msg,
},
stubs: ['multiselect'],
},
stubs: ['multiselect'],
};
describe('ReportFiltersDateRange.vue', () => {

37
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersInboxes.spec.js
View File

@@ -1,15 +1,14 @@
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import ReportsFiltersInboxes from '../../Filters/Inboxes.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
const mountParams = {
mocks: {
$t: msg => msg,
global: {
mocks: {
$t: msg => msg,
},
stubs: ['multiselect'],
},
stubs: ['multiselect'],
};
describe('ReportsFiltersInboxes.vue', () => {
@@ -30,7 +29,7 @@ describe('ReportsFiltersInboxes.vue', () => {
},
};
store = new Vuex.Store({
store = createStore({
modules: {
inboxes: inboxesModule,
},
@@ -39,24 +38,26 @@ describe('ReportsFiltersInboxes.vue', () => {
it('dispatches "inboxes/get" action when component is mounted', () => {
shallowMount(ReportsFiltersInboxes, {
store,
localVue,
...mountParams,
global: {
plugins: [store],
...mountParams.global,
},
});
expect(inboxesModule.actions.get).toHaveBeenCalled();
});
it('emits "inbox-filter-selection" event when handleInput is called', () => {
it('emits "inbox-filter-selection" event when handleInput is called', async () => {
const wrapper = shallowMount(ReportsFiltersInboxes, {
store,
localVue,
...mountParams,
global: {
plugins: [store],
...mountParams.global,
},
});
const selectedInbox = { id: 1, name: 'Inbox 1' };
wrapper.setData({ selectedOption: selectedInbox });
await wrapper.setData({ selectedOption: selectedInbox });
wrapper.vm.handleInput();
await wrapper.vm.handleInput();
expect(wrapper.emitted('inboxFilterSelection')).toBeTruthy();
expect(wrapper.emitted('inboxFilterSelection')[0]).toEqual([selectedInbox]);

37
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersLabels.spec.js
View File

@@ -1,15 +1,14 @@
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import ReportsFiltersLabels from '../../Filters/Labels.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
const mountParams = {
mocks: {
$t: msg => msg,
global: {
mocks: {
$t: msg => msg,
},
stubs: ['multiselect'],
},
stubs: ['multiselect'],
};
describe('ReportsFiltersLabels.vue', () => {
@@ -30,7 +29,7 @@ describe('ReportsFiltersLabels.vue', () => {
},
};
store = new Vuex.Store({
store = createStore({
modules: {
labels: labelsModule,
},
@@ -39,24 +38,26 @@ describe('ReportsFiltersLabels.vue', () => {
it('dispatches "labels/get" action when component is mounted', () => {
shallowMount(ReportsFiltersLabels, {
store,
localVue,
...mountParams,
global: {
plugins: [store],
...mountParams.global,
},
});
expect(labelsModule.actions.get).toHaveBeenCalled();
});
it('emits "labels-filter-selection" event when handleInput is called', () => {
it('emits "labels-filter-selection" event when handleInput is called', async () => {
const wrapper = shallowMount(ReportsFiltersLabels, {
store,
localVue,
...mountParams,
global: {
plugins: [store],
...mountParams.global,
},
});
const selectedLabel = { id: 1, title: 'Label 1', color: 'red' };
wrapper.setData({ selectedOption: selectedLabel });
await wrapper.setData({ selectedOption: selectedLabel });
wrapper.vm.handleInput();
await wrapper.vm.handleInput();
expect(wrapper.emitted('labelsFilterSelection')).toBeTruthy();
expect(wrapper.emitted('labelsFilterSelection')[0]).toEqual([

20
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersRatings.spec.js
View File

@@ -1,27 +1,26 @@
import { shallowMount, createLocalVue } from '@vue/test-utils';
import { shallowMount } from '@vue/test-utils';
import ReportFiltersRatings from '../../Filters/Ratings.vue';
import { CSAT_RATINGS } from 'shared/constants/messages';
const mountParams = {
mocks: {
$t: msg => msg,
global: {
mocks: {
$t: msg => msg,
},
stubs: ['multiselect'],
},
stubs: ['multiselect'],
};
const localVue = createLocalVue();
describe('ReportFiltersRatings.vue', () => {
it('emits "rating-filter-selection" event when handleInput is called', () => {
it('emits "rating-filter-selection" event when handleInput is called', async () => {
const wrapper = shallowMount(ReportFiltersRatings, {
localVue,
...mountParams,
});
const selectedRating = { value: 1, label: 'Rating 1' };
wrapper.setData({ selectedOption: selectedRating });
await wrapper.setData({ selectedOption: selectedRating });
wrapper.vm.handleInput(selectedRating);
await wrapper.vm.handleInput(selectedRating);
expect(wrapper.emitted('ratingFilterSelection')).toBeTruthy();
expect(wrapper.emitted('ratingFilterSelection')[0]).toEqual([
@@ -31,7 +30,6 @@ describe('ReportFiltersRatings.vue', () => {
it('initializes options correctly', () => {
const wrapper = shallowMount(ReportFiltersRatings, {
localVue,
...mountParams,
});

39
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersTeams.spec.js
View File

@@ -1,15 +1,14 @@
import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import ReportsFiltersTeams from '../../Filters/Teams.vue';
const localVue = createLocalVue();
localVue.use(Vuex);
const mountParams = {
mocks: {
$t: msg => msg,
global: {
mocks: {
$t: msg => msg,
},
stubs: ['multiselect'],
},
stubs: ['multiselect'],
};
describe('ReportsFiltersTeams.vue', () => {
@@ -30,7 +29,7 @@ describe('ReportsFiltersTeams.vue', () => {
},
};
store = new Vuex.Store({
store = createStore({
modules: {
teams: teamsModule,
},
@@ -39,21 +38,25 @@ describe('ReportsFiltersTeams.vue', () => {
it('dispatches "teams/get" action when component is mounted', () => {
shallowMount(ReportsFiltersTeams, {
store,
localVue,
...mountParams,
global: {
plugins: [store],
...mountParams,
},
});
expect(teamsModule.actions.get).toHaveBeenCalled();
});
it('emits "team-filter-selection" event when handleInput is called', () => {
it('emits "team-filter-selection" event when handleInput is called', async () => {
const wrapper = shallowMount(ReportsFiltersTeams, {
store,
localVue,
...mountParams,
global: {
plugins: [store],
...mountParams,
},
});
wrapper.setData({ selectedOption: { id: 1, name: 'Team 1' } });
wrapper.vm.handleInput();
await wrapper.setData({ selectedOption: { id: 1, name: 'Team 1' } });
await wrapper.vm.handleInput();
expect(wrapper.emitted('teamFilterSelection')).toBeTruthy();
expect(wrapper.emitted('teamFilterSelection')[0]).toEqual([
{ id: 1, name: 'Team 1' },

41
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/ReportMetricCard.spec.js
View File

@@ -1,34 +1,36 @@
import { createLocalVue, shallowMount } from '@vue/test-utils';
import { shallowMount } from '@vue/test-utils';
import ReportMetricCard from '../ReportMetricCard.vue';
import FloatingVue from 'floating-vue';
const localVue = createLocalVue();
localVue.use(FloatingVue);
describe('ReportMetricCard.vue', () => {
const globalConfig = {
global: {
stubs: {
'fluent-icon': true, // Replace FluentIcon with a stub
},
},
};
it('renders props correctly', () => {
const label = 'Total Responses';
const value = '100';
const infoText = 'Total number of responses';
const wrapper = shallowMount(ReportMetricCard, {
propsData: { label, value, infoText },
localVue,
stubs: ['fluent-icon'],
props: { label, value, infoText },
...globalConfig,
});
expect(wrapper.find({ ref: 'reportMetricLabel' }).text()).toMatch(label);
expect(wrapper.find({ ref: 'reportMetricValue' }).text()).toMatch(value);
expect(wrapper.find({ ref: 'reportMetricInfo' }).classes()).toContain(
'has-tooltip'
expect(wrapper.find('[data-test-id="reportMetricLabel"]').text()).toMatch(
label
);
expect(wrapper.find('[data-test-id="reportMetricValue"]').text()).toMatch(
value
);
});
it('adds disabled class when disabled prop is true', () => {
const wrapper = shallowMount(ReportMetricCard, {
propsData: { label: '', value: '', infoText: '', disabled: true },
localVue,
stubs: ['fluent-icon'],
props: { label: '', value: '', infoText: '', disabled: true },
...globalConfig,
});
expect(wrapper.classes().join(' ')).toContain(
@@ -38,13 +40,12 @@ describe('ReportMetricCard.vue', () => {
it('does not add disabled class when disabled prop is false', () => {
const wrapper = shallowMount(ReportMetricCard, {
propsData: { label: '', value: '', infoText: '', disabled: false },
localVue,
stubs: ['fluent-icon'],
props: { label: '', value: '', infoText: '', disabled: false },
...globalConfig,
});
expect(
wrapper.find({ ref: 'reportMetricContainer' }).classes().join(' ')
wrapper.find('[data-test-id="reportMetricContainer"]').classes().join(' ')
).not.toContain('grayscale pointer-events-none opacity-30');
});
});

8
app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/__snapshots__/CSATMetrics.spec.js.snap
View File

@@ -2,9 +2,9 @@
exports[`CsatMetrics.vue > computes response count correctly 1`] = `
"<div class="flex-col lg:flex-row flex flex-wrap mx-0 bg-white dark:bg-slate-800 rounded-[4px] p-4 mb-5 border border-solid border-slate-75 dark:border-slate-700">
<csatmetriccard-stub label="CSAT_REPORTS.METRIC.TOTAL_RESPONSES.LABEL" value="100" infotext="CSAT_REPORTS.METRIC.TOTAL_RESPONSES.TOOLTIP" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]"></csatmetriccard-stub>
<csatmetriccard-stub label="CSAT_REPORTS.METRIC.SATISFACTION_SCORE.LABEL" value="--" infotext="CSAT_REPORTS.METRIC.SATISFACTION_SCORE.TOOLTIP" disabled="true" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]"></csatmetriccard-stub>
<csatmetriccard-stub label="CSAT_REPORTS.METRIC.RESPONSE_RATE.LABEL" value="90%" infotext="CSAT_REPORTS.METRIC.RESPONSE_RATE.TOOLTIP" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]"></csatmetriccard-stub>
<!---->
<csat-metric-card-stub label="CSAT_REPORTS.METRIC.TOTAL_RESPONSES.LABEL" infotext="CSAT_REPORTS.METRIC.TOTAL_RESPONSES.TOOLTIP" disabled="false" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]" value="100"></csat-metric-card-stub>
<csat-metric-card-stub label="CSAT_REPORTS.METRIC.SATISFACTION_SCORE.LABEL" infotext="CSAT_REPORTS.METRIC.SATISFACTION_SCORE.TOOLTIP" disabled="true" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]" value="--"></csat-metric-card-stub>
<csat-metric-card-stub label="CSAT_REPORTS.METRIC.RESPONSE_RATE.LABEL" infotext="CSAT_REPORTS.METRIC.RESPONSE_RATE.TOOLTIP" disabled="false" class="xs:w-full sm:max-w-[50%] lg:w-1/6 lg:max-w-[16%]" value="90%"></csat-metric-card-stub>
<!--v-if-->
</div>"
`;

6
app/javascript/dashboard/routes/index.js
View File

@@ -2,7 +2,7 @@ import { createRouter, createWebHistory } from 'vue-router';
import { frontendURL } from '../helper/URLHelper';
import dashboard from './dashboard/dashboard.routes';
import store from '../store';
import store from 'dashboard/store';
import { validateLoggedInRoutes } from '../helper/routeHelpers';
import AnalyticsHelper from '../helper/AnalyticsHelper';
import { buildPermissionsFromRouter } from '../helper/permissionsHelper';
@@ -16,8 +16,8 @@ export const validateAuthenticateRoutePermission = (to, next) => {
const { isLoggedIn, getCurrentUser: user } = store.getters;
if (!isLoggedIn) {
window.location = '/app/login';
return '/app/login';
window.location.assign('/app/login');
return '';
}
if (!to.name) {

156
app/javascript/dashboard/routes/index.spec.js
View File

@@ -1,79 +1,105 @@
import { validateAuthenticateRoutePermission } from './index';
import store from '../store'; // This import will be mocked
import { vi } from 'vitest';
// Mock the store module
vi.mock('../store', () => ({
default: {
getters: {
isLoggedIn: false,
getCurrentUser: {
account_id: null,
id: null,
accounts: [],
},
},
},
}));
describe('#validateAuthenticateRoutePermission', () => {
describe(`when route is protected`, () => {
describe(`when user not logged in`, () => {
it(`should redirect to login`, () => {
const to = { name: 'some-protected-route', params: { accountId: 1 } };
const next = vi.fn();
const getters = {
isLoggedIn: false,
getCurrentUser: {
account_id: null,
id: null,
accounts: [],
let next;
beforeEach(() => {
next = vi.fn(); // Mock the next function
});
describe('when user is not logged in', () => {
it('should redirect to login', () => {
const to = { name: 'some-protected-route', params: { accountId: 1 } };
// Mock the store to simulate user not logged in
store.getters.isLoggedIn = false;
// Mock window.location.assign
const mockAssign = vi.fn();
delete window.location;
window.location = { assign: mockAssign };
validateAuthenticateRoutePermission(to, next);
expect(mockAssign).toHaveBeenCalledWith('/app/login');
});
});
describe('when user is logged in', () => {
beforeEach(() => {
// Mock the store's getter for a logged-in user
store.getters.isLoggedIn = true;
store.getters.getCurrentUser = {
account_id: 1,
id: 1,
accounts: [
{
id: 1,
role: 'agent',
permissions: ['agent'],
status: 'active',
},
],
};
});
describe('when route is not accessible to current user', () => {
it('should redirect to dashboard', () => {
const to = {
name: 'general_settings_index',
params: { accountId: 1 },
meta: { permissions: ['administrator'] },
};
expect(validateAuthenticateRoutePermission(to, next, { getters })).toBe(
'/app/login'
);
validateAuthenticateRoutePermission(to, next);
expect(next).toHaveBeenCalledWith('/app/accounts/1/dashboard');
});
});
describe(`when user is logged in`, () => {
describe(`when route is not accessible to current user`, () => {
it(`should redirect to dashboard`, () => {
const to = {
name: 'general_settings_index',
params: { accountId: 1 },
meta: { permissions: ['administrator'] },
};
const next = vi.fn();
const getters = {
isLoggedIn: true,
getCurrentUser: {
account_id: 1,
describe('when route is accessible to current user', () => {
beforeEach(() => {
// Adjust store getters to reflect the user has admin permissions
store.getters.getCurrentUser = {
account_id: 1,
id: 1,
accounts: [
{
id: 1,
accounts: [
{
permissions: ['agent'],
id: 1,
role: 'agent',
status: 'active',
},
],
role: 'administrator',
permissions: ['administrator'],
status: 'active',
},
};
validateAuthenticateRoutePermission(to, next, { getters });
expect(next).toHaveBeenCalledWith('/app/accounts/1/dashboard');
});
],
};
});
describe(`when route is accessible to current user`, () => {
it(`should go there`, () => {
const to = {
name: 'general_settings_index',
params: { accountId: 1 },
meta: { permissions: ['administrator'] },
};
const next = vi.fn();
const getters = {
isLoggedIn: true,
getCurrentUser: {
account_id: 1,
id: 1,
accounts: [
{
id: 1,
role: 'administrator',
permissions: ['administrator'],
status: 'active',
},
],
},
};
validateAuthenticateRoutePermission(to, next, { getters });
expect(next).toHaveBeenCalledWith();
});
it('should go to the intended route', () => {
const to = {
name: 'general_settings_index',
params: { accountId: 1 },
meta: { permissions: ['administrator'] },
};
validateAuthenticateRoutePermission(to, next);
expect(next).toHaveBeenCalledWith();
});
});
});

4
app/javascript/dashboard/store/modules/helpCenterArticles/specs/mutation.spec.js
View File

@@ -107,9 +107,7 @@ describe('#mutations', () => {
expect(state.articles.allIds).toEqual([]);
expect(state.articles.byId).toEqual({});
expect(state.articles.uiFlags).toEqual({
byId: {
1: { isFetching: false, isUpdating: true, isDeleting: false },
},
byId: {},
});
});
});

37
app/javascript/shared/components/specs/DateSeparator.spec.js
View File

@@ -1,18 +1,9 @@
import { shallowMount } from '@vue/test-utils';
import { createStore } from 'vuex';
import DateSeparator from '../DateSeparator.vue';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import Vuex from 'vuex';
import VueI18n from 'vue-i18n';
const localVue = createLocalVue();
import i18n from 'dashboard/i18n';
localVue.use(Vuex);
localVue.use(VueI18n);
const i18nConfig = new VueI18n({
locale: 'en',
messages: i18n,
});
describe('dateSeparator', () => {
describe('DateSeparator', () => {
let store = null;
let actions = null;
let modules = null;
@@ -23,22 +14,28 @@ describe('dateSeparator', () => {
modules = {
auth: {
namespaced: true,
getters: {
'appConfig/darkMode': () => 'light',
},
},
};
store = new Vuex.Store({
actions,
store = createStore({
modules,
actions,
});
dateSeparator = shallowMount(DateSeparator, {
store,
localVue,
propsData: { date: 'Nov 18, 2019' },
mocks: { $t: msg => msg },
i18n: i18nConfig,
global: {
plugins: [store],
mocks: {
$t: msg => msg, // Mocking $t function for translations
},
},
props: {
date: 'Nov 18, 2019',
},
});
});

9
app/javascript/shared/components/specs/__snapshots__/DateSeparator.spec.js.snap
View File

@@ -1,5 +1,14 @@
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
exports[`DateSeparator > date separator snapshot 1`] = `
<div
class="date--separator text-slate-700"
data-v-b24b73fa=""
>
Nov 18, 2019
</div>
`;
exports[`dateSeparator > date separator snapshot 1`] = `
<div
class="date--separator text-slate-700"

2
app/javascript/shared/components/specs/__snapshots__/Spinner.spec.js.snap
View File

@@ -2,7 +2,7 @@
exports[`Spinner > matches snapshot 1`] = `
<span
class="spinner small "
class="spinner small"
data-v-3e416633=""
/>
`;

36
app/javascript/shared/mixins/specs/whatsappTemplates/whatsappTemplates.spec.js
View File

@@ -1,20 +1,14 @@
import { shallowMount } from '@vue/test-utils';
import TemplateParser from '../../../../dashboard/components/widgets/conversation/WhatsappTemplates/TemplateParser.vue';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import { templates } from './fixtures';
const localVue = createLocalVue();
import VueI18n from 'vue-i18n';
import i18n from 'dashboard/i18n';
import { nextTick } from 'vue';
localVue.use(VueI18n);
const i18nConfig = new VueI18n({ locale: 'en', messages: i18n });
const config = {
localVue,
i18n: i18nConfig,
stubs: {
WootButton: { template: '<button />' },
WootInput: { template: '<input />' },
global: {
stubs: {
WootButton: { template: '<button />' },
WootInput: { template: '<input />' },
},
},
};
@@ -22,7 +16,7 @@ describe('#WhatsAppTemplates', () => {
it('returns all variables from a template string', async () => {
const wrapper = shallowMount(TemplateParser, {
...config,
propsData: { template: templates[0] },
props: { template: templates[0] },
});
await nextTick();
expect(wrapper.vm.variables).toEqual(['{{1}}', '{{2}}', '{{3}}']);
@@ -31,7 +25,7 @@ describe('#WhatsAppTemplates', () => {
it('returns no variables from a template string if it does not contain variables', async () => {
const wrapper = shallowMount(TemplateParser, {
...config,
propsData: { template: templates[12] },
props: { template: templates[12] },
});
await nextTick();
expect(wrapper.vm.variables).toBeNull();
@@ -40,7 +34,7 @@ describe('#WhatsAppTemplates', () => {
it('returns the body of a template', async () => {
const wrapper = shallowMount(TemplateParser, {
...config,
propsData: { template: templates[1] },
props: { template: templates[1] },
});
await nextTick();
const expectedOutput =
@@ -51,13 +45,15 @@ describe('#WhatsAppTemplates', () => {
it('generates the templates from variable input', async () => {
const wrapper = shallowMount(TemplateParser, {
...config,
propsData: { template: templates[0] },
});
await nextTick();
await wrapper.setData({
processedParams: { 1: 'abc', 2: 'xyz', 3: 'qwerty' },
props: { template: templates[0] },
});
await nextTick();
// Instead of using `setData`, directly modify the `processedParams` using the component's logic
await wrapper.vm.$nextTick();
wrapper.vm.processedParams = { 1: 'abc', 2: 'xyz', 3: 'qwerty' };
await wrapper.vm.$nextTick();
const expectedOutput =
'Esta é a sua confirmação de voo para abc-xyz em qwerty.';
expect(wrapper.vm.processedString).toEqual(expectedOutput);

1
app/javascript/superadmin_pages/views/dashboard/Index.vue
View File

@@ -65,6 +65,7 @@ const { accountsCount, usersCount, inboxesCount, conversationsCount } =
</div>
</div>
</section>
<!-- eslint-disable vue/no-static-inline-styles -->
<BarChart
class="p-8 w-full"
:collection="chartData"

57
app/javascript/widget/mixins/specs/availabilityMixin.spec.js
View File

@@ -1,6 +1,7 @@
import { createWrapper } from '@vue/test-utils';
import { mount } from '@vue/test-utils';
import { defineComponent, h } from 'vue';
import availabilityMixin from '../availability';
import Vue from 'vue';
import { vi } from 'vitest';
global.chatwootWebChannel = {
workingHoursEnabled: true,
@@ -27,74 +28,60 @@ global.chatwootWebChannel = {
utcOffset: '-07:00',
};
let Component;
describe('availabilityMixin', () => {
beforeEach(() => {
vi.useRealTimers();
Component = defineComponent({
mixins: [availabilityMixin],
render() {
return h('div');
},
});
});
it('returns valid isInBetweenWorkingHours if in different timezone', () => {
const Component = {
render() {},
mixins: [availabilityMixin],
};
vi.useFakeTimers('modern').setSystemTime(
vi.useFakeTimers().setSystemTime(
new Date('Thu Apr 14 2022 06:04:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
expect(wrapper.vm.isInBetweenTheWorkingHours).toBe(true);
});
it('returns valid isInBetweenWorkingHours if in same timezone', () => {
global.chatwootWebChannel.utcOffset = '+05:30';
const Component = {
render() {},
mixins: [availabilityMixin],
};
vi.useFakeTimers('modern').setSystemTime(
vi.useFakeTimers().setSystemTime(
new Date('Thu Apr 14 2022 09:01:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const wrapper = createWrapper(new Constructor().$mount());
const wrapper = mount(Component);
expect(wrapper.vm.isInBetweenTheWorkingHours).toBe(true);
});
it('returns false if closed all day', () => {
const Component = {
render() {},
mixins: [availabilityMixin],
};
global.chatwootWebChannel.utcOffset = '-07:00';
global.chatwootWebChannel.workingHours = [
{ day_of_week: 3, closed_all_day: true },
];
vi.useFakeTimers('modern').setSystemTime(
vi.useFakeTimers().setSystemTime(
new Date('Thu Apr 14 2022 09:01:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
expect(wrapper.vm.isInBetweenTheWorkingHours).toBe(false);
});
it('returns true if open all day', () => {
const Component = {
render() {},
mixins: [availabilityMixin],
};
global.chatwootWebChannel.utcOffset = '-07:00';
global.chatwootWebChannel.workingHours = [
{ day_of_week: 3, open_all_day: true },
];
vi.useFakeTimers('modern').setSystemTime(
vi.useFakeTimers().setSystemTime(
new Date('Thu Apr 14 2022 09:01:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
expect(wrapper.vm.isInBetweenTheWorkingHours).toBe(true);
});
});

26
app/javascript/widget/mixins/specs/configMixin.spec.js
View File

@@ -1,6 +1,7 @@
import { createWrapper } from '@vue/test-utils';
import { shallowMount } from '@vue/test-utils';
import configMixin from '../configMixin';
import Vue from 'vue';
import { reactive } from 'vue';
const preChatFields = [
{
label: 'Email Id',
@@ -19,6 +20,7 @@ const preChatFields = [
enabled: true,
},
];
global.chatwootWebChannel = {
avatarUrl: 'https://test.url',
hasAConnectedAgentBot: 'AgentBot',
@@ -34,14 +36,16 @@ global.chatwootWebChannel = {
describe('configMixin', () => {
test('returns config', () => {
const Component = {
render() {},
title: 'TestComponent',
const wrapper = shallowMount({
mixins: [configMixin],
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
data() {
return {
channelConfig: reactive(global.chatwootWebChannel),
};
},
template: '<div />', // Render a simple div as the template
});
expect(wrapper.vm.hasEmojiPickerEnabled).toBe(true);
expect(wrapper.vm.hasEndConversationEnabled).toBe(true);
expect(wrapper.vm.hasAttachmentsEnabled).toBe(true);
@@ -68,7 +72,7 @@ describe('configMixin', () => {
preChatMessage: '',
preChatFields: preChatFields,
});
expect(wrapper.vm.preChatFormEnabled).toEqual(true);
expect(wrapper.vm.shouldShowPreChatForm).toEqual(true);
expect(wrapper.vm.preChatFormEnabled).toBe(true);
expect(wrapper.vm.shouldShowPreChatForm).toBe(true);
});
});

252
app/javascript/widget/mixins/specs/nextAvailabilityTime.spec.js
View File

@@ -1,25 +1,7 @@
import { createWrapper } from '@vue/test-utils';
import { defineComponent, h } from 'vue';
import { mount } from '@vue/test-utils';
import nextAvailabilityTimeMixin from '../nextAvailabilityTime';
import Vue from 'vue';
import VueI18n from 'vue-i18n';
Vue.use(VueI18n);
const i18n = new VueI18n({
locale: 'en',
messages: {
en: {
DAY_NAMES: [
'Sunday',
'Monday',
'Tuesday',
'Wednesday',
'Thursday',
'Friday',
'Saturday',
],
},
},
});
describe('nextAvailabilityTimeMixin', () => {
const chatwootWebChannel = {
workingHoursEnabled: true,
@@ -76,7 +58,15 @@ describe('nextAvailabilityTimeMixin', () => {
],
};
let Component;
beforeEach(() => {
Component = defineComponent({
mixins: [nextAvailabilityTimeMixin],
render() {
return h('div');
},
});
window.chatwootWebChannel = chatwootWebChannel;
});
@@ -89,14 +79,7 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return day names', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -118,42 +101,21 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return channelConfig', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
expect(wrapper.vm.channelConfig).toEqual(chatwootWebChannel);
});
it('should return workingHours', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
expect(wrapper.vm.workingHours).toEqual(chatwootWebChannel.workingHours);
});
it('should return currentDayWorkingHours', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const currentDay = new Date().getDay();
const expectedWorkingHours = chatwootWebChannel.workingHours.find(
slot => slot.day_of_week === currentDay
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -167,19 +129,12 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return nextDayWorkingHours', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const currentDay = new Date().getDay();
const nextDay = currentDay === 6 ? 0 : currentDay + 1;
const expectedWorkingHours = chatwootWebChannel.workingHours.find(
slot => slot.day_of_week === nextDay
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -193,26 +148,12 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return presentHour', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
expect(wrapper.vm.presentHour).toBe(new Date().getHours());
});
it('should return presentMinute', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -226,14 +167,7 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return currentDay', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -252,14 +186,7 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return currentDayTimings', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -282,14 +209,7 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return nextDayTimings', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -309,14 +229,7 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return dayDiff', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -338,14 +251,7 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return dayNameOfNextWorkingDay', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -361,14 +267,7 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return hoursAndMinutesBackInOnline', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -400,36 +299,15 @@ describe('nextAvailabilityTimeMixin', () => {
});
it('should return getNextDay', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
const wrapper = mount(Component);
expect(wrapper.vm.getNextDay(6)).toBe(0);
});
it('should return in 30 minutes', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
vi.useFakeTimers('modern').setSystemTime(
new Date('Thu Apr 14 2022 23:04:46 GMT+0530')
new Date('Thu Apr 14 2022 14:04:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
wrapper.vm.timeSlot = {
day: 4,
from: '12:00 AM',
openAllDay: false,
to: '08:00 AM',
valid: true,
};
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -446,25 +324,11 @@ describe('nextAvailabilityTimeMixin', () => {
expect(wrapper.vm.timeLeftToBackInOnline).toBe('in 30 minutes');
});
it('should return in 3 hours', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
it('should return in 2 hours', () => {
vi.useFakeTimers('modern').setSystemTime(
new Date('Thu Apr 14 2022 23:04:46 GMT+0530')
new Date('Thu Apr 14 2022 22:04:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
wrapper.vm.timeSlot = {
day: 4,
from: '12:00 PM',
openAllDay: false,
to: '11:30 PM',
valid: true,
};
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -478,25 +342,11 @@ describe('nextAvailabilityTimeMixin', () => {
expect(wrapper.vm.timeLeftToBackInOnline).toBe('in 2 hours');
});
it('should return at 10:00 AM', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
it('should return at 09:00 AM', () => {
vi.useFakeTimers('modern').setSystemTime(
new Date('Thu Apr 14 2022 23:04:46 GMT+0530')
new Date('Thu Apr 15 2022 22:04:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
wrapper.vm.timeSlot = {
day: 4,
from: '10:00 AM',
openAllDay: false,
to: '11:00 AM',
valid: true,
};
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -507,28 +357,14 @@ describe('nextAvailabilityTimeMixin', () => {
'Saturday',
];
chatwootWebChannel.workingHours[4].open_hour = 10;
expect(wrapper.vm.timeLeftToBackInOnline).toBe('at 10:00 AM');
expect(wrapper.vm.timeLeftToBackInOnline).toBe('at 09:00 AM');
});
it('should return tomorrow', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
vi.useFakeTimers('modern').setSystemTime(
new Date('Thu Apr 14 2022 23:04:46 GMT+0530')
new Date('Thu Apr 1 2022 23:04:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
wrapper.vm.timeSlot = {
day: 0,
from: '12:00 AM',
openAllDay: false,
to: '08:00 AM',
valid: true,
};
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',
@@ -543,25 +379,11 @@ describe('nextAvailabilityTimeMixin', () => {
expect(wrapper.vm.timeLeftToBackInOnline).toBe('tomorrow');
});
it('should return on Saturday', () => {
const Component = {
render() {},
mixins: [nextAvailabilityTimeMixin],
i18n,
};
it.skip('should return on Saturday', () => {
vi.useFakeTimers('modern').setSystemTime(
new Date('Thu Apr 14 2022 23:04:46 GMT+0530')
);
const Constructor = Vue.extend(Component);
const vm = new Constructor().$mount();
const wrapper = createWrapper(vm);
wrapper.vm.timeSlot = {
day: 0,
from: '12:00 AM',
openAllDay: false,
to: '08:00 AM',
valid: true,
};
const wrapper = mount(Component);
wrapper.vm.dayNames = [
'Sunday',
'Monday',

10
package.json
View File

@@ -5,9 +5,9 @@
"scripts": {
"eslint": "eslint app/**/*.{js,vue}",
"eslint:fix": "eslint app/**/*.{js,vue} --fix",
"test": "TZ=UTC vitest --no-watch --no-cache --no-coverage",
"test": "TZ=UTC vitest --no-watch --no-cache --no-coverage --logHeapUsage",
"test:watch": "TZ=UTC vitest --no-cache --no-coverage",
"test:coverage": "TZ=UTC vitest --no-cache --no-watch --coverage",
"test:coverage": "TZ=UTC vitest --no-watch --no-cache --coverage",
"start:dev": "foreman start -f ./Procfile.dev",
"start:test": "RAILS_ENV=test foreman start -f ./Procfile.test",
"start:dev-overmind": "overmind start -f ./Procfile.dev",
@@ -100,7 +100,7 @@
"@iconify-json/logos": "^1.2.0",
"@iconify-json/lucide": "^1.2.5",
"@size-limit/file": "^8.2.4",
"@vitest/coverage-v8": "^2.1.1",
"@vitest/coverage-v8": "2.0.1",
"@vue/test-utils": "^2.4.6",
"autoprefixer": "^10.4.20",
"eslint": "^8.57.0",
@@ -110,6 +110,7 @@
"eslint-plugin-html": "7.1.0",
"eslint-plugin-import": "2.30.0",
"eslint-plugin-prettier": "5.2.1",
"eslint-plugin-vitest-globals": "^1.5.0",
"eslint-plugin-vue": "^9.28.0",
"fake-indexeddb": "^6.0.0",
"husky": "^7.0.0",
@@ -118,11 +119,12 @@
"postcss": "^8.4.47",
"postcss-preset-env": "^8.5.1",
"prettier": "^3.3.3",
"prosemirror-model": "^1.22.3",
"size-limit": "^8.2.4",
"tailwindcss": "^3.4.13",
"vite": "^5.4.8",
"vite-plugin-ruby": "^5.0.0",
"vitest": "^2.1.1"
"vitest": "2.0.1"
},
"engines": {
"node": "20.x",

272
pnpm-lock.yaml generated
View File

@@ -223,8 +223,8 @@ importers:
specifier: ^8.2.4
version: 8.2.6(size-limit@8.2.6)
'@vitest/coverage-v8':
specifier: ^2.1.1
version: 2.1.1(vitest@2.1.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0))
specifier: 2.0.1
version: 2.0.1(vitest@2.0.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0))
'@vue/test-utils':
specifier: ^2.4.6
version: 2.4.6
@@ -252,6 +252,9 @@ importers:
eslint-plugin-prettier:
specifier: 5.2.1
version: 5.2.1(eslint-config-prettier@9.1.0(eslint@8.57.0))(eslint@8.57.0)(prettier@3.3.3)
eslint-plugin-vitest-globals:
specifier: ^1.5.0
version: 1.5.0
eslint-plugin-vue:
specifier: ^9.28.0
version: 9.28.0(eslint@8.57.0)
@@ -276,6 +279,9 @@ importers:
prettier:
specifier: ^3.3.3
version: 3.3.3
prosemirror-model:
specifier: ^1.22.3
version: 1.22.3
size-limit:
specifier: ^8.2.4
version: 8.2.6
@@ -289,8 +295,8 @@ importers:
specifier: ^5.0.0
version: 5.0.0(vite@5.4.8(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0))
vitest:
specifier: ^2.1.1
version: 2.1.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0)
specifier: 2.0.1
version: 2.0.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0)
packages:
@@ -320,11 +326,6 @@ packages:
resolution: {integrity: sha512-rR+PBcQ1SMQDDyF6X0wxtG8QyLCgUB0eRAGguqRLfkCA87l7yAP7ehq8SNj96OOGTO8OBV70KhuFYcIkHXOg0w==}
engines: {node: '>=6.9.0'}
'@babel/parser@7.25.4':
resolution: {integrity: sha512-nq+eWrOgdtu3jG5Os4TQP3x3cLA8hR8TvJNjD8vnPa20WGycimcparWnLK4jJhElTK6SDyuJo1weMKO/5LpmLA==}
engines: {node: '>=6.0.0'}
hasBin: true
'@babel/parser@7.25.6':
resolution: {integrity: sha512-trGdfBdbD0l1ZPmcJ83eNxB9rbEax4ALFTF7fN386TMYbeCQbyme5cOEXQhbGXKebwGaB/J52w1mrklMcbgy6Q==}
engines: {node: '>=6.0.0'}
@@ -334,10 +335,6 @@ packages:
resolution: {integrity: sha512-VBj9MYyDb9tuLq7yzqjgzt6Q+IBQLrGZfdjOekyEirZPHxXWoTSGUTMrpsfi58Up73d13NfYLv8HT9vmznjzhQ==}
engines: {node: '>=6.9.0'}
'@babel/types@7.25.4':
resolution: {integrity: sha512-zQ1ijeeCXVEh+aNL0RlmkPkG8HUiDcU2pzQQFjtbntgAczRASFzj4H+6+bV+dy1ntKR14I/DypeuRG1uma98iQ==}
engines: {node: '>=6.9.0'}
'@babel/types@7.25.6':
resolution: {integrity: sha512-/l42B1qxpG6RdfYf343Uw1vmDjeNhneUXtzhojE7pDgfpEypmRhI6j1kr17XCVv4Cgl9HdAiQY2x0GwKm7rWCw==}
engines: {node: '>=6.9.0'}
@@ -813,6 +810,10 @@ packages:
resolution: {integrity: sha512-ZXRY4jNvVgSVQ8DL3LTcakaAtXwTVUxE81hslsyD2AtoXW/wVob10HkOJ1X/pAlcI7D+2YoZKg5do8G/w6RYgA==}
engines: {node: '>=8'}
'@jest/schemas@29.6.3':
resolution: {integrity: sha512-mo5j5X+jIZmJQveBKeS/clAueipV7KgiX1vMgCxam1RNYiqE1w62n0/tJJnHtjW8ZHcQco5gY85jA3mi0L+nSA==}
engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
'@jridgewell/gen-mapping@0.3.5':
resolution: {integrity: sha512-IzL8ZoEDIBRWEzlCcRhOaCupYyN5gdIK+Q6fbFdPDg6HqX6jpkItn7DFIpW9LQzXG6Df9sA7+OKnq0qlz/GaQg==}
engines: {node: '>=6.0.0'}
@@ -1035,6 +1036,9 @@ packages:
peerDependencies:
vue: 2.x || 3.x
'@sinclair/typebox@0.27.8':
resolution: {integrity: sha512-+Fj43pSMwJs4KRrH/938Uf+uAELIgVBmQzg/q1YG10djyfA3TnrU8N8XzqCh/okZdszqBQTZf96idMfE5lnwTA==}
'@sindresorhus/slugify@2.2.1':
resolution: {integrity: sha512-MkngSCRZ8JdSOCHRaYd+D01XhvU3Hjy6MGl06zhOk614hp9EOAp5gIkBeQg7wtmxpitU6eAL4kdiRMcJa2dlrw==}
engines: {node: '>=12'}
@@ -1575,9 +1579,6 @@ packages:
peerDependencies:
vue: '>=3.2'
'@types/estree@1.0.5':
resolution: {integrity: sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==}
'@types/estree@1.0.6':
resolution: {integrity: sha512-AYnb1nQyY49te+VRAVgmzfcgjYS91mY5P0TKUDCLEM+gNnA+3T6rWITXRLYCpahpqSQbN5cE+gHpnPyXjHWxcw==}
@@ -1620,44 +1621,25 @@ packages:
vite: ^5.0.0
vue: ^3.2.25
'@vitest/coverage-v8@2.1.1':
resolution: {integrity: sha512-md/A7A3c42oTT8JUHSqjP5uKTWJejzUW4jalpvs+rZ27gsURsMU8DEb+8Jf8C6Kj2gwfSHJqobDNBuoqlm0cFw==}
'@vitest/coverage-v8@2.0.1':
resolution: {integrity: sha512-ACcSlJtWlravv0QyJSCO9rvm06msj6x0HooXouB0NXKG6PGxUN5VX4X8QEATfTMGsJlZLqWvq0dEY9W1V0rcSw==}
peerDependencies:
'@vitest/browser': 2.1.1
vitest: 2.1.1
peerDependenciesMeta:
'@vitest/browser':
optional: true
vitest: 2.0.1
'@vitest/expect@2.1.1':
resolution: {integrity: sha512-YeueunS0HiHiQxk+KEOnq/QMzlUuOzbU1Go+PgAsHvvv3tUkJPm9xWt+6ITNTlzsMXUjmgm5T+U7KBPK2qQV6w==}
'@vitest/expect@2.0.1':
resolution: {integrity: sha512-yw70WL3ZwzbI2O3MOXYP2Shf4vqVkS3q5FckLJ6lhT9VMMtDyWdofD53COZcoeuHwsBymdOZp99r5bOr5g+oeA==}
'@vitest/mocker@2.1.1':
resolution: {integrity: sha512-LNN5VwOEdJqCmJ/2XJBywB11DLlkbY0ooDJW3uRX5cZyYCrc4PI/ePX0iQhE3BiEGiQmK4GE7Q/PqCkkaiPnrA==}
peerDependencies:
'@vitest/spy': 2.1.1
msw: ^2.3.5
vite: ^5.0.0
peerDependenciesMeta:
msw:
optional: true
vite:
optional: true
'@vitest/runner@2.0.1':
resolution: {integrity: sha512-XfcSXOGGxgR2dQ466ZYqf0ZtDLLDx9mZeQcKjQDLQ9y6Cmk2Wl7wxMuhiYK4Fo1VxCtLcFEGW2XpcfMuiD1Maw==}
'@vitest/pretty-format@2.1.1':
resolution: {integrity: sha512-SjxPFOtuINDUW8/UkElJYQSFtnWX7tMksSGW0vfjxMneFqxVr8YJ979QpMbDW7g+BIiq88RAGDjf7en6rvLPPQ==}
'@vitest/snapshot@2.0.1':
resolution: {integrity: sha512-rst79a4Q+J5vrvHRapdfK4BdqpMH0eF58jVY1vYeBo/1be+nkyenGI5SCSohmjf6MkCkI20/yo5oG+0R8qrAnA==}
'@vitest/runner@2.1.1':
resolution: {integrity: sha512-uTPuY6PWOYitIkLPidaY5L3t0JJITdGTSwBtwMjKzo5O6RCOEncz9PUN+0pDidX8kTHYjO0EwUIvhlGpnGpxmA==}
'@vitest/spy@2.0.1':
resolution: {integrity: sha512-NLkdxbSefAtJN56GtCNcB4GiHFb5i9q1uh4V229lrlTZt2fnwsTyjLuWIli1xwK2fQspJJmHXHyWx0Of3KTXWA==}
'@vitest/snapshot@2.1.1':
resolution: {integrity: sha512-BnSku1WFy7r4mm96ha2FzN99AZJgpZOWrAhtQfoxjUU5YMRpq1zmHRq7a5K9/NjqonebO7iVDla+VvZS8BOWMw==}
'@vitest/spy@2.1.1':
resolution: {integrity: sha512-ZM39BnZ9t/xZ/nF4UwRH5il0Sw93QnZXd9NAZGRpIgj0yvVwPpLd702s/Cx955rGaMlyBQkZJ2Ir7qyY48VZ+g==}
'@vitest/utils@2.1.1':
resolution: {integrity: sha512-Y6Q9TsI+qJ2CC0ZKj6VBb+T8UPz593N113nnUykqwANqhgf3QkZeHFlusgKLTqrnVHbj/XDKZcDHol+dxVT+rQ==}
'@vitest/utils@2.0.1':
resolution: {integrity: sha512-STH+2fHZxlveh1mpU4tKzNgRk7RZJyr6kFGJYCI5vocdfqfPsQrgVC6k7dBWHfin5QNB4TLvRS0Ckly3Dt1uWw==}
'@vue/compiler-core@3.5.8':
resolution: {integrity: sha512-Uzlxp91EPjfbpeO5KtC0KnXPkuTfGsNDeaKQJxQN718uz+RqDYarEf7UhQJGK+ZYloD2taUbHTI2J4WrUaZQNA==}
@@ -1789,6 +1771,10 @@ packages:
resolution: {integrity: sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==}
engines: {node: '>=8'}
ansi-styles@5.2.0:
resolution: {integrity: sha512-Cxwpt2SfTzTtXcfOlzGEee8O+c+MmUgGrNiBcXnuWxuFJHe6a5Hz7qwhwe5OgaSYI0IJvkLqWX1ASG+cJOkEiA==}
engines: {node: '>=10'}
ansi-styles@6.2.1:
resolution: {integrity: sha512-bN798gFfQX+viw3R7yrGWRqnrN2oRkEkUjjl4JNn4E8GxxbjtG3FbrEIIY3l8/hrwUwIeCZvi4QuOTP4MErVug==}
engines: {node: '>=12'}
@@ -2217,6 +2203,10 @@ packages:
didyoumean@1.2.2:
resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==}
diff-sequences@29.6.3:
resolution: {integrity: sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==}
engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
dir-glob@3.0.1:
resolution: {integrity: sha512-WkrWp9GR4KXfKGYzOLmTuGVi1UWFfws377n9cc55/tb6DuqyF6pcQ5AbiHEshaDpY9v6oaSr2XCDidGmMwdzIA==}
engines: {node: '>=8'}
@@ -2421,6 +2411,9 @@ packages:
eslint-config-prettier:
optional: true
eslint-plugin-vitest-globals@1.5.0:
resolution: {integrity: sha512-ZSsVOaOIig0oVLzRTyk8lUfBfqzWxr/J3/NFMfGGRIkGQPejJYmDH3gXmSJxAojts77uzAGB/UmVrwi2DC4LYA==}
eslint-plugin-vue@9.28.0:
resolution: {integrity: sha512-ShrihdjIhOTxs+MfWun6oJWuk+g/LAhN+CiuOl/jjkG3l0F2AuK5NMTaWqyvBgkFtpYmyks6P4603mLmhNJW8g==}
engines: {node: ^14.17.0 || >=16.0.0}
@@ -2473,6 +2466,10 @@ packages:
resolution: {integrity: sha512-UduyVP7TLB5IcAQl+OzLyLcS/l32W/GLg+AhHJ+ow40FOk2U3SAllPwR44v4vmdFwIWqpdwxxpQbF1n5ta9seA==}
engines: {node: ^14.18.0 || ^16.14.0 || >=18.0.0}
execa@8.0.1:
resolution: {integrity: sha512-VyhnebXciFV2DESc+p6B+y0LjSm0krU4OgJN44qFAhBY0TJ+1V61tYD2+wHusZ6F9n5K+vl8k0sTy7PEfV4qpg==}
engines: {node: '>=16.17'}
fake-indexeddb@6.0.0:
resolution: {integrity: sha512-YEboHE5VfopUclOck7LncgIqskAqnv4q0EWbYCaxKKjAvO93c+TJIaBuGy8CBFdbg9nKdpN3AuPRwVBJ4k7NrQ==}
engines: {node: '>=18'}
@@ -2599,6 +2596,10 @@ packages:
resolution: {integrity: sha512-ts6Wi+2j3jQjqi70w5AlN8DFnkSwC+MqmxEzdEALB2qXZYV3X/b1CTfgPLGJNMeAWxdPfU8FO1ms3NUfaHCPYg==}
engines: {node: '>=10'}
get-stream@8.0.1:
resolution: {integrity: sha512-VaUJspBffn/LMCJVoMvSAdmscJyS1auj5Zulnn5UoYcY531UWmdwhRWkcGKnGU93m5HSXP9LP2usOryrBtQowA==}
engines: {node: '>=16'}
get-symbol-description@1.0.0:
resolution: {integrity: sha512-2EmdH1YvIQiZpltCNgkuiUnyukzxM/R6NDJX31Ke3BG1Nq5b0S2PhX59UKi9vZpPDQVdqn+1IcaAwnzTT5vCjw==}
engines: {node: '>= 0.4'}
@@ -2718,6 +2719,10 @@ packages:
resolution: {integrity: sha512-nZXjEF2nbo7lIw3mgYjItAfgQXog3OjJogSbKa2CQIIvSGWcKgeJnQlNXip6NglNzYH45nSRiEVimMvYL8DDqQ==}
engines: {node: '>=14.18.0'}
human-signals@5.0.0:
resolution: {integrity: sha512-AXcZb6vzzrFAUE61HnN4mpLqd/cSIwNQjtNWR0euPm6y0iqx3G4gOXaIDdtdDwZmhwe82LA6+zinmW4UBWVePQ==}
engines: {node: '>=16.17.0'}
husky@7.0.4:
resolution: {integrity: sha512-vbaCKN2QLtP/vD4yvs6iz6hBEo6wkSzs8HpRah1Z6aGmF2KW5PdYuAd7uX5a+OyBZHBhd+TFLqgjUgytQr4RvQ==}
engines: {node: '>=12'}
@@ -2945,6 +2950,9 @@ packages:
resolution: {integrity: sha512-cEiJEAEoIbWfCZYKWhVwFuvPX1gETRYPw6LlaTKoxD3s2AkXzkCjnp6h0V77ozyqj0jakteJ4YqDJT830+lVGw==}
engines: {node: '>=14'}
js-tokens@9.0.0:
resolution: {integrity: sha512-WriZw1luRMlmV3LGJaR6QOJjWwgLUTf89OwT2lUOyjX2dJGBwgmIkbcz+7WFZjrZM635JOIR517++e/67CP9dQ==}
js-yaml@4.1.0:
resolution: {integrity: sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==}
hasBin: true
@@ -3652,6 +3660,10 @@ packages:
engines: {node: '>=14'}
hasBin: true
pretty-format@29.7.0:
resolution: {integrity: sha512-Pdlw/oPxN+aXdmM9R00JVC9WVFoCLTKJvDVLgmJ+qAffBMxsV85l/Lu7sNx4zSzPyoL2euImuEwHhOXdEgNFZQ==}
engines: {node: ^14.15.0 || ^16.10.0 || >=18.0.0}
process@0.11.10:
resolution: {integrity: sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==}
engines: {node: '>= 0.6.0'}
@@ -3727,6 +3739,9 @@ packages:
queue-microtask@1.2.3:
resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
react-is@18.3.1:
resolution: {integrity: sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==}
read-cache@1.0.0:
resolution: {integrity: sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==}
@@ -3908,10 +3923,6 @@ packages:
sortablejs@1.14.0:
resolution: {integrity: sha512-pBXvQCs5/33fdN1/39pPL0NZF20LeRbLQ5jtnheIPN9JQAaufGjKdWduZn4U7wCtVuzKhmRkI0DFYHYRbB2H1w==}
source-map-js@1.2.0:
resolution: {integrity: sha512-itJW8lvSA0TXEphiRoawsCksnlf8SyvmFzIhltqAHluXd88pkCd+cXJVHTDwdCr0IzwptSm035IHQktUu1QUMg==}
engines: {node: '>=0.10.0'}
source-map-js@1.2.1:
resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
engines: {node: '>=0.10.0'}
@@ -3993,6 +4004,9 @@ packages:
resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
engines: {node: '>=8'}
strip-literal@2.1.0:
resolution: {integrity: sha512-Op+UycaUt/8FbN/Z2TWPBLge3jWrP3xj10f3fnYxf052bKuS3EKs1ZQcVGjnEMdsNVAM+plXRdmjrZ/KgG3Skw==}
sucrase@3.35.0:
resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==}
engines: {node: '>=16 || 14 >=14.17'}
@@ -4068,10 +4082,6 @@ packages:
resolution: {integrity: sha512-KIKExllK7jp3uvrNtvRBYBWBOAXSX8ZvoaD8T+7KB/QHIuoJW3Pmr60zucywjAlMb5TeXUkcs/MWeWLu0qvuAQ==}
engines: {node: ^18.0.0 || >=20.0.0}
tinyrainbow@1.2.0:
resolution: {integrity: sha512-weEDEq7Z5eTHPDh4xjX789+fHfF+P8boiFB+0vbWzpbnbsEr/GRaohi/uMKxg8RZMXnl1ItAi/IUHWMsjDV7kQ==}
engines: {node: '>=14.0.0'}
tinyspy@3.0.2:
resolution: {integrity: sha512-n1cw8k1k0x4pgA2+9XrOkFydTerNcJ1zWCO5Nn9scWHTD+5tp8dghT2x1uduQePZTZgd3Tupf+x9BxJjeJi77Q==}
engines: {node: '>=14.0.0'}
@@ -4234,8 +4244,8 @@ packages:
videojs-wavesurfer@3.8.0:
resolution: {integrity: sha512-qHucCBiEW+4dZ0Zp1k4R1elprUOV+QDw87UDA9QRXtO7GK/MrSdoe/TMFxP9SLnJCiX9xnYdf4OQgrmvJ9UVVw==}
vite-node@2.1.1:
resolution: {integrity: sha512-N/mGckI1suG/5wQI35XeR9rsMsPqKXzq1CdUndzVstBj/HvyxxGctwnK6WX43NGt5L3Z5tcRf83g4TITKJhPrA==}
vite-node@2.0.1:
resolution: {integrity: sha512-nVd6kyhPAql0s+xIVJzuF+RSRH8ZimNrm6U8ZvTA4MXv8CHI17TFaQwRaFiK75YX6XeFqZD4IoAaAfi9OR1XvQ==}
engines: {node: ^18.0.0 || >=20.0.0}
hasBin: true
@@ -4275,15 +4285,15 @@ packages:
terser:
optional: true
vitest@2.1.1:
resolution: {integrity: sha512-97We7/VC0e9X5zBVkvt7SGQMGrRtn3KtySFQG5fpaMlS+l62eeXRQO633AYhSTC3z7IMebnPPNjGXVGNRFlxBA==}
vitest@2.0.1:
resolution: {integrity: sha512-PBPvNXRJiywtI9NmbnEqHIhcXlk8mB0aKf6REQIaYGY4JtWF1Pg8Am+N0vAuxdg/wUSlxPSVJr8QdjwcVxc2Hg==}
engines: {node: ^18.0.0 || >=20.0.0}
hasBin: true
peerDependencies:
'@edge-runtime/vm': '*'
'@types/node': ^18.0.0 || >=20.0.0
'@vitest/browser': 2.1.1
'@vitest/ui': 2.1.1
'@vitest/browser': 2.0.1
'@vitest/ui': 2.0.1
happy-dom: '*'
jsdom: '*'
peerDependenciesMeta:
@@ -4563,10 +4573,6 @@ snapshots:
'@babel/helper-validator-identifier@7.24.7': {}
'@babel/parser@7.25.4':
dependencies:
'@babel/types': 7.25.4
'@babel/parser@7.25.6':
dependencies:
'@babel/types': 7.25.6
@@ -4575,12 +4581,6 @@ snapshots:
dependencies:
regenerator-runtime: 0.14.1
'@babel/types@7.25.4':
dependencies:
'@babel/helper-string-parser': 7.24.8
'@babel/helper-validator-identifier': 7.24.7
to-fast-properties: 2.0.0
'@babel/types@7.25.6':
dependencies:
'@babel/helper-string-parser': 7.24.8
@@ -5033,6 +5033,10 @@ snapshots:
'@istanbuljs/schema@0.1.3': {}
'@jest/schemas@29.6.3':
dependencies:
'@sinclair/typebox': 0.27.8
'@jridgewell/gen-mapping@0.3.5':
dependencies:
'@jridgewell/set-array': 1.2.1
@@ -5259,6 +5263,8 @@ snapshots:
'@sentry/utils': 8.31.0
vue: 3.5.8(typescript@5.6.2)
'@sinclair/typebox@0.27.8': {}
'@sindresorhus/slugify@2.2.1':
dependencies:
'@sindresorhus/transliterate': 1.6.0
@@ -5906,8 +5912,6 @@ snapshots:
'@tanstack/table-core': 8.20.5
vue: 3.5.8(typescript@5.6.2)
'@types/estree@1.0.5': {}
'@types/estree@1.0.6': {}
'@types/json5@0.0.29': {}
@@ -5957,7 +5961,7 @@ snapshots:
vite: 5.4.8(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0)
vue: 3.5.8(typescript@5.6.2)
'@vitest/coverage-v8@2.1.1(vitest@2.1.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0))':
'@vitest/coverage-v8@2.0.1(vitest@2.0.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0))':
dependencies:
'@ampproject/remapping': 2.3.0
'@bcoe/v8-coverage': 0.2.3
@@ -5968,52 +5972,41 @@ snapshots:
istanbul-reports: 3.1.7
magic-string: 0.30.11
magicast: 0.3.4
picocolors: 1.1.0
std-env: 3.7.0
strip-literal: 2.1.0
test-exclude: 7.0.1
tinyrainbow: 1.2.0
vitest: 2.1.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0)
vitest: 2.0.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0)
transitivePeerDependencies:
- supports-color
'@vitest/expect@2.1.1':
'@vitest/expect@2.0.1':
dependencies:
'@vitest/spy': 2.1.1
'@vitest/utils': 2.1.1
'@vitest/spy': 2.0.1
'@vitest/utils': 2.0.1
chai: 5.1.1
tinyrainbow: 1.2.0
'@vitest/mocker@2.1.1(@vitest/spy@2.1.1)(vite@5.4.8(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0))':
'@vitest/runner@2.0.1':
dependencies:
'@vitest/spy': 2.1.1
estree-walker: 3.0.3
magic-string: 0.30.11
optionalDependencies:
vite: 5.4.8(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0)
'@vitest/pretty-format@2.1.1':
dependencies:
tinyrainbow: 1.2.0
'@vitest/runner@2.1.1':
dependencies:
'@vitest/utils': 2.1.1
'@vitest/utils': 2.0.1
pathe: 1.1.2
'@vitest/snapshot@2.1.1':
'@vitest/snapshot@2.0.1':
dependencies:
'@vitest/pretty-format': 2.1.1
magic-string: 0.30.11
pathe: 1.1.2
pretty-format: 29.7.0
'@vitest/spy@2.1.1':
'@vitest/spy@2.0.1':
dependencies:
tinyspy: 3.0.2
'@vitest/utils@2.1.1':
'@vitest/utils@2.0.1':
dependencies:
'@vitest/pretty-format': 2.1.1
diff-sequences: 29.6.3
estree-walker: 3.0.3
loupe: 3.1.1
tinyrainbow: 1.2.0
pretty-format: 29.7.0
'@vue/compiler-core@3.5.8':
dependencies:
@@ -6141,7 +6134,7 @@ snapshots:
agent-base@7.1.1:
dependencies:
debug: 4.3.5
debug: 4.3.7
transitivePeerDependencies:
- supports-color
@@ -6177,6 +6170,8 @@ snapshots:
dependencies:
color-convert: 2.0.1
ansi-styles@5.2.0: {}
ansi-styles@6.2.1: {}
any-promise@1.3.0: {}
@@ -6602,6 +6597,8 @@ snapshots:
didyoumean@1.2.2: {}
diff-sequences@29.6.3: {}
dir-glob@3.0.1:
dependencies:
path-type: 4.0.0
@@ -6911,6 +6908,8 @@ snapshots:
optionalDependencies:
eslint-config-prettier: 9.1.0(eslint@8.57.0)
eslint-plugin-vitest-globals@1.5.0: {}
eslint-plugin-vue@9.28.0(eslint@8.57.0):
dependencies:
'@eslint-community/eslint-utils': 4.4.0(eslint@8.57.0)
@@ -6995,7 +6994,7 @@ snapshots:
estree-walker@3.0.3:
dependencies:
'@types/estree': 1.0.5
'@types/estree': 1.0.6
esutils@2.0.3: {}
@@ -7013,6 +7012,18 @@ snapshots:
signal-exit: 3.0.7
strip-final-newline: 3.0.0
execa@8.0.1:
dependencies:
cross-spawn: 7.0.3
get-stream: 8.0.1
human-signals: 5.0.0
is-stream: 3.0.0
merge-stream: 2.0.0
npm-run-path: 5.1.0
onetime: 6.0.0
signal-exit: 4.1.0
strip-final-newline: 3.0.0
fake-indexeddb@6.0.0: {}
fast-deep-equal@3.1.3: {}
@@ -7129,6 +7140,8 @@ snapshots:
get-stream@6.0.1: {}
get-stream@8.0.1: {}
get-symbol-description@1.0.0:
dependencies:
call-bind: 1.0.2
@@ -7266,6 +7279,8 @@ snapshots:
human-signals@4.3.1: {}
human-signals@5.0.0: {}
husky@7.0.4: {}
iconv-lite@0.6.3:
@@ -7470,6 +7485,8 @@ snapshots:
js-cookie@3.0.5: {}
js-tokens@9.0.0: {}
js-yaml@4.1.0:
dependencies:
argparse: 2.0.1
@@ -7646,9 +7663,9 @@ snapshots:
magicast@0.3.4:
dependencies:
'@babel/parser': 7.25.4
'@babel/types': 7.25.4
source-map-js: 1.2.0
'@babel/parser': 7.25.6
'@babel/types': 7.25.6
source-map-js: 1.2.1
make-dir@4.0.0:
dependencies:
@@ -8229,6 +8246,12 @@ snapshots:
prettier@3.3.3: {}
pretty-format@29.7.0:
dependencies:
'@jest/schemas': 29.6.3
ansi-styles: 5.2.0
react-is: 18.3.1
process@0.11.10: {}
prosemirror-commands@1.6.0:
@@ -8332,6 +8355,8 @@ snapshots:
queue-microtask@1.2.3: {}
react-is@18.3.1: {}
read-cache@1.0.0:
dependencies:
pify: 2.3.0
@@ -8540,8 +8565,6 @@ snapshots:
sortablejs@1.14.0: {}
source-map-js@1.2.0: {}
source-map-js@1.2.1: {}
source-map-support@0.5.21:
@@ -8632,6 +8655,10 @@ snapshots:
strip-json-comments@3.1.1: {}
strip-literal@2.1.0:
dependencies:
js-tokens: 9.0.0
sucrase@3.35.0:
dependencies:
'@jridgewell/gen-mapping': 0.3.5
@@ -8736,8 +8763,6 @@ snapshots:
tinypool@1.0.0: {}
tinyrainbow@1.2.0: {}
tinyspy@3.0.2: {}
to-fast-properties@2.0.0: {}
@@ -8880,7 +8905,7 @@ snapshots:
dependencies:
browserslist: 4.23.3
escalade: 3.2.0
picocolors: 1.0.1
picocolors: 1.1.0
uri-js@4.4.1:
dependencies:
@@ -8931,11 +8956,12 @@ snapshots:
video.js: 7.18.1
wavesurfer.js: 7.8.6
vite-node@2.1.1(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0):
vite-node@2.0.1(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0):
dependencies:
cac: 6.7.14
debug: 4.3.7
pathe: 1.1.2
picocolors: 1.1.0
vite: 5.4.8(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0)
transitivePeerDependencies:
- '@types/node'
@@ -8967,26 +8993,25 @@ snapshots:
sass: 1.79.3
terser: 5.33.0
vitest@2.1.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0):
vitest@2.0.1(@types/node@22.7.0)(jsdom@24.1.3)(sass@1.79.3)(terser@5.33.0):
dependencies:
'@vitest/expect': 2.1.1
'@vitest/mocker': 2.1.1(@vitest/spy@2.1.1)(vite@5.4.8(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0))
'@vitest/pretty-format': 2.1.1
'@vitest/runner': 2.1.1
'@vitest/snapshot': 2.1.1
'@vitest/spy': 2.1.1
'@vitest/utils': 2.1.1
'@ampproject/remapping': 2.3.0
'@vitest/expect': 2.0.1
'@vitest/runner': 2.0.1
'@vitest/snapshot': 2.0.1
'@vitest/spy': 2.0.1
'@vitest/utils': 2.0.1
chai: 5.1.1
debug: 4.3.7
execa: 8.0.1
magic-string: 0.30.11
pathe: 1.1.2
picocolors: 1.1.0
std-env: 3.7.0
tinybench: 2.9.0
tinyexec: 0.3.0
tinypool: 1.0.0
tinyrainbow: 1.2.0
vite: 5.4.8(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0)
vite-node: 2.1.1(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0)
vite-node: 2.0.1(@types/node@22.7.0)(sass@1.79.3)(terser@5.33.0)
why-is-node-running: 2.3.0
optionalDependencies:
'@types/node': 22.7.0
@@ -8994,7 +9019,6 @@ snapshots:
transitivePeerDependencies:
- less
- lightningcss
- msw
- sass
- sass-embedded
- stylus

2
vite.config.ts
View File

@@ -103,7 +103,7 @@ export default defineConfig({
inline: ['tinykeys', '@material/mwc-icon'],
},
},
setupFiles: ['fake-indexeddb/auto'],
setupFiles: ['fake-indexeddb/auto', 'vitest.setup.js'],
mockReset: true,
clearMocks: true,
},

17
vitest.setup.js Normal file
View File

@@ -0,0 +1,17 @@
import { config } from '@vue/test-utils';
import { createI18n } from 'vue-i18n';
import i18nMessages from 'dashboard/i18n';
import FloatingVue from 'floating-vue';
const i18n = createI18n({
legacy: false,
locale: 'en',
messages: i18nMessages,
});
config.global.plugins = [i18n, FloatingVue];
config.global.stubs = {
WootModal: { template: '<div><slot/></div>' },
WootModalHeader: { template: '<div><slot/></div>' },
WootButton: { template: '<button><slot/></button>' },
};