Mizah/mizzkey
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

refactor(frontend): カスタムディレクティブの型付け など

Browse source 
(cherry picked from commit 49c9215b61a70e020c5b28a68756bfdc0df3cac7)
This commit is contained in:
taiyme 2024-11-01 21:07:35 +09:00 committed by kakkokari-gtyih
parent a61a2c5f87
commit 1c34a03b7a
19 changed files with 262 additions and 138 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
packages/frontend/.storybook/preview.ts
View file

@ -64,13 +64,13 @@ initialize({
initLocalStorage();
queueMicrotask(() => {
Promise.all([
import('../src/components'),
import('../src/directives'),
import('../src/widgets'),
import('../src/scripts/theme'),
import('../src/store'),
import('../src/os'),
]).then(([{ default: components }, { default: directives }, { default: widgets }, { applyTheme }, { defaultStore }, os]) => {
import('../src/directives/index.js'),
import('../src/components/index.js'),
import('../src/widgets/index.js'),
import('../src/scripts/theme.js'),
import('../src/store.js'),
import('../src/os.js'),
]).then(([{ default: directives }, { default: components }, { default: widgets }, { applyTheme }, { defaultStore }, os]) => {
setup((app) => {
moduleInitialized = true;
if (app[appInitialized]) {
@ -78,8 +78,8 @@ queueMicrotask(() => {
}
app[appInitialized] = true;
loadTheme(applyTheme);
components(app);
directives(app);
components(app);
widgets(app);
misskeyOS = os;
if (isChromatic()) {

4
packages/frontend/src/boot/common.ts
View file

@ -6,9 +6,9 @@
import { computed, watch, version as vueVersion, App } from 'vue';
import { compareVersions } from 'compare-versions';
import { version, lang, updateLocale, locale } from '@@/js/config.js';
import widgets from '@/widgets/index.js';
import directives from '@/directives/index.js';
import components from '@/components/index.js';
import widgets from '@/widgets/index.js';
import { applyTheme } from '@/scripts/theme.js';
import { isDeviceDarkmode } from '@/scripts/is-device-darkmode.js';
import { updateI18n, i18n } from '@/i18n.js';
@ -239,9 +239,9 @@ export async function common(createVue: () => App<Element>) {
app.config.performance = true;
}
widgets(app);
directives(app);
components(app);
widgets(app);
// https://github.com/misskey-dev/misskey/pull/8575#issuecomment-1114239210
// なぜか2回実行されることがあるため、mountするdivを1つに制限する

2
packages/frontend/src/components/MkWidgets.vue
View file

@ -54,7 +54,7 @@ import { defineAsyncComponent, ref } from 'vue';
import { v4 as uuid } from 'uuid';
import MkSelect from '@/components/MkSelect.vue';
import MkButton from '@/components/MkButton.vue';
import { widgets as widgetDefs } from '@/widgets/index.js';
import { widgetDefs } from '@/widgets/index.js';
import * as os from '@/os.js';
import { i18n } from '@/i18n.js';
import { isLink } from '@@/js/is-link.js';

62
packages/frontend/src/components/index.ts
View file

@ -3,7 +3,7 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { App } from 'vue';
import type { App } from 'vue';
import Mfm from './global/MkMfm.js';
import MkA from './global/MkA.vue';
@ -34,28 +34,28 @@ export default function(app: App) {
}
export const components = {
I18n: I18n,
RouterView: RouterView,
Mfm: Mfm,
MkA: MkA,
MkAcct: MkAcct,
MkAvatar: MkAvatar,
MkEmoji: MkEmoji,
MkCondensedLine: MkCondensedLine,
MkCustomEmoji: MkCustomEmoji,
MkUserName: MkUserName,
MkEllipsis: MkEllipsis,
MkTime: MkTime,
MkUrl: MkUrl,
MkLoading: MkLoading,
MkError: MkError,
MkAd: MkAd,
MkPageHeader: MkPageHeader,
MkSpacer: MkSpacer,
MkFooterSpacer: MkFooterSpacer,
MkStickyContainer: MkStickyContainer,
MkLazy: MkLazy,
};
I18n,
RouterView,
Mfm,
MkA,
MkAcct,
MkAd,
MkAvatar,
MkCondensedLine,
MkCustomEmoji,
MkEllipsis,
MkEmoji,
MkError,
MkFooterSpacer,
MkLazy,
MkLoading,
MkPageHeader,
MkSpacer,
MkStickyContainer,
MkTime,
MkUrl,
MkUserName,
} as const;
declare module '@vue/runtime-core' {
export interface GlobalComponents {
@ -64,21 +64,21 @@ declare module '@vue/runtime-core' {
Mfm: typeof Mfm;
MkA: typeof MkA;
MkAcct: typeof MkAcct;
MkAd: typeof MkAd;
MkAvatar: typeof MkAvatar;
MkEmoji: typeof MkEmoji;
MkCondensedLine: typeof MkCondensedLine;
MkCustomEmoji: typeof MkCustomEmoji;
MkUserName: typeof MkUserName;
MkEllipsis: typeof MkEllipsis;
MkTime: typeof MkTime;
MkUrl: typeof MkUrl;
MkLoading: typeof MkLoading;
MkEmoji: typeof MkEmoji;
MkError: typeof MkError;
MkAd: typeof MkAd;
MkFooterSpacer: typeof MkFooterSpacer;
MkLazy: typeof MkLazy;
MkLoading: typeof MkLoading;
MkPageHeader: typeof MkPageHeader;
MkSpacer: typeof MkSpacer;
MkFooterSpacer: typeof MkFooterSpacer;
MkStickyContainer: typeof MkStickyContainer;
MkLazy: typeof MkLazy;
MkTime: typeof MkTime;
MkUrl: typeof MkUrl;
MkUserName: typeof MkUserName;
}
}

15
packages/frontend/src/directives/adaptive-bg.ts
View file

@ -4,10 +4,17 @@
*/
import type { ObjectDirective } from 'vue';
import { getBgColor } from '@/scripts/get-bg-color.js';
export const vAdaptiveBg: ObjectDirective<HTMLElement, null | undefined> = {
mounted(src) {
type VAdaptiveBg = ObjectDirective<HTMLElement, null | undefined>;
export const vAdaptiveBg = {
async mounted(src) {
const [
{ getBgColor },
] = await Promise.all([
import('@/scripts/get-bg-color.js'),
]);
const parentBg = getBgColor(src.parentElement) ?? 'transparent';
const myBg = window.getComputedStyle(src).backgroundColor;
@ -18,4 +25,4 @@ export const vAdaptiveBg: ObjectDirective<HTMLElement, null | undefined> = {
src.style.backgroundColor = myBg;
}
},
};
} satisfies VAdaptiveBg as VAdaptiveBg;

15
packages/frontend/src/directives/adaptive-border.ts
View file

@ -4,10 +4,17 @@
*/
import type { ObjectDirective } from 'vue';
import { getBgColor } from '@/scripts/get-bg-color.js';
export const vAdaptiveBorder: ObjectDirective<HTMLElement, null | undefined> = {
mounted(src) {
type VAdaptiveBorder = ObjectDirective<HTMLElement, null | undefined>;
export const vAdaptiveBorder = {
async mounted(src) {
const [
{ getBgColor },
] = await Promise.all([
import('@/scripts/get-bg-color.js'),
]);
const parentBg = getBgColor(src.parentElement) ?? 'transparent';
const myBg = window.getComputedStyle(src).backgroundColor;
@ -18,4 +25,4 @@ export const vAdaptiveBorder: ObjectDirective<HTMLElement, null | undefined> = {
src.style.borderColor = myBg;
}
},
};
} satisfies VAdaptiveBorder as VAdaptiveBorder;

10
packages/frontend/src/directives/anim.ts
View file

@ -5,8 +5,10 @@
import type { ObjectDirective } from 'vue';
export const vAnim: ObjectDirective<HTMLElement, number | null | undefined> = {
beforeMount(src) {
type VAnim = ObjectDirective<HTMLElement, number | null | undefined>;
export const vAnim = {
async beforeMount(src) {
src.style.opacity = '0';
src.style.transform = 'scale(0.9)';
// ページネーションと相性が悪いので
@ -16,10 +18,10 @@ export const vAnim: ObjectDirective<HTMLElement, number | null | undefined> = {
src.classList.add('_zoom');
},
mounted(src) {
async mounted(src) {
window.setTimeout(() => {
src.style.opacity = '1';
src.style.transform = 'none';
}, 1);
},
};
} satisfies VAnim as VAnim;

10
packages/frontend/src/directives/appear.ts
View file

@ -5,8 +5,10 @@
import type { ObjectDirective } from 'vue';
export const vAppear: ObjectDirective<HTMLElement, (() => unknown) | null | undefined> = {
mounted(src, binding) {
type VAppear = ObjectDirective<HTMLElement, (() => unknown) | null | undefined>;
export const vAppear = {
async mounted(src, binding) {
const fn = binding.value;
if (fn == null) return;
@ -21,7 +23,7 @@ export const vAppear: ObjectDirective<HTMLElement, (() => unknown) | null | unde
src._observer_ = observer;
},
unmounted(src) {
async unmounted(src) {
src._observer_?.disconnect();
},
};
} satisfies VAppear as VAppear;

15
packages/frontend/src/directives/click-anime.ts
View file

@ -4,10 +4,17 @@
*/
import type { ObjectDirective } from 'vue';
import { defaultStore } from '@/store.js';
export const vClickAnime: ObjectDirective<HTMLElement, null | undefined> = {
mounted(src) {
type VClickAnime = ObjectDirective<HTMLElement, null | undefined>;
export const vClickAnime = {
async mounted(src) {
const [
{ defaultStore },
] = await Promise.all([
import('@/store.js'),
]);
if (!defaultStore.state.animation) return;
const target = src.children[0];
@ -37,4 +44,4 @@ export const vClickAnime: ObjectDirective<HTMLElement, null | undefined> = {
target.classList.add('_anime_bounce_standBy');
});
},
};
} satisfies VClickAnime as VClickAnime;

12
packages/frontend/src/directives/get-size.ts
View file

@ -11,8 +11,10 @@ const mountings = new Map<HTMLElement, {
fn: (w: number, h: number) => void;
}>();
export const vGetSize: ObjectDirective<HTMLElement, ((w: number, h: number) => unknown) | null | undefined> = {
mounted(src, binding) {
type VGetSize = ObjectDirective<HTMLElement, ((w: number, h: number) => unknown) | null | undefined>;
export const vGetSize = {
async mounted(src, binding) {
const resize = new ResizeObserver(() => {
calc(src);
});
@ -22,15 +24,15 @@ export const vGetSize: ObjectDirective<HTMLElement, ((w: number, h: number) => u
calc(src);
},
unmounted(src, binding) {
if (binding.value != null) binding.value(0, 0);
async unmounted(src, binding) {
binding.value(0, 0);
const info = mountings.get(src);
if (!info) return;
info.resize.disconnect();
if (info.intersection) info.intersection.disconnect();
mountings.delete(src);
},
};
} satisfies VGetSize as VGetSize;
function calc(src: HTMLElement) {
const info = mountings.get(src);

17
packages/frontend/src/directives/hotkey.ts
View file

@ -5,10 +5,17 @@
import type { ObjectDirective } from 'vue';
import type { Keymap } from '@/scripts/hotkey.js';
import { makeHotkey } from '@/scripts/hotkey.js';
export const vHotkey: ObjectDirective<HTMLElement, Keymap | null | undefined, 'global'> = {
mounted(src, binding) {
type VHotkey = ObjectDirective<HTMLElement, Keymap | null | undefined, 'global'>;
export const vHotkey = {
async mounted(src, binding) {
const [
{ makeHotkey },
] = await Promise.all([
import('@/scripts/hotkey.js'),
]);
src._hotkey_global = binding.modifiers.global === true;
src._keyHandler = makeHotkey(binding.value);
@ -20,11 +27,11 @@ export const vHotkey: ObjectDirective<HTMLElement, Keymap | null | undefined, 'g
}
},
unmounted(src) {
async unmounted(src) {
if (src._hotkey_global) {
document.removeEventListener('keydown', src._keyHandler);
} else {
src.removeEventListener('keydown', src._keyHandler);
}
},
};
} satisfies VHotkey as VHotkey;

15
packages/frontend/src/directives/panel.ts
View file

@ -4,10 +4,17 @@
*/
import type { ObjectDirective } from 'vue';
import { getBgColor } from '@/scripts/get-bg-color.js';
export const vPanel: ObjectDirective<HTMLElement, null | undefined> = {
mounted(src) {
type VPanel = ObjectDirective<HTMLElement, null | undefined>;
export const vPanel = {
async mounted(src) {
const [
{ getBgColor },
] = await Promise.all([
import('@/scripts/get-bg-color.js'),
]);
const parentBg = getBgColor(src.parentElement) ?? 'transparent';
const myBg = getComputedStyle(document.documentElement).getPropertyValue('--MI_THEME-panel');
@ -18,4 +25,4 @@ export const vPanel: ObjectDirective<HTMLElement, null | undefined> = {
src.style.backgroundColor = 'var(--MI_THEME-panel)';
}
},
};
} satisfies VPanel as VPanel;

15
packages/frontend/src/directives/ripple.ts
View file

@ -4,11 +4,18 @@
*/
import type { ObjectDirective } from 'vue';
import { popup } from '@/os.js';
import MkRippleEffect from '@/components/MkRippleEffect.vue';
export const vRipple: ObjectDirective<HTMLElement, boolean | null | undefined> = {
mounted(src, binding) {
type VRipple = ObjectDirective<HTMLElement, boolean | null | undefined>;
export const vRipple = {
async mounted(src, binding) {
const [
{ popup },
] = await Promise.all([
import('@/os.js'),
]);
// 明示的に false であればバインドしない
if (binding.value === false) return;
@ -23,4 +30,4 @@ export const vRipple: ObjectDirective<HTMLElement, boolean | null | undefined> =
});
});
},
};
} satisfies VRipple as VRipple;

29
packages/frontend/src/directives/tooltip.ts
View file

@ -6,16 +6,23 @@
// TODO: useTooltip関数使うようにしたい
// ただディレクティブ内でonUnmountedなどのcomposition api使えるのか不明
import { defineAsyncComponent, ref } from 'vue';
import type { ObjectDirective } from 'vue';
import { isTouchUsing } from '@/scripts/touch.js';
import { popup, alert } from '@/os.js';
import { type ObjectDirective, defineAsyncComponent, ref } from 'vue';
const start = isTouchUsing ? 'touchstart' : 'mouseenter';
const end = isTouchUsing ? 'touchend' : 'mouseleave';
type VTooltip = ObjectDirective<HTMLElement, string | null | undefined, 'noDelay' | 'mfm' | 'top' | 'right' | 'bottom' | 'left', 'dialog'>;
export const vTooltip = {
async mounted(src, binding) {
const [
{ alert, popup },
{ isTouchUsing },
] = await Promise.all([
import('@/os.js'),
import('@/scripts/touch.js'),
]);
const start = isTouchUsing ? 'touchstart' : 'mouseenter';
const end = isTouchUsing ? 'touchend' : 'mouseleave';
export const vTooltip: ObjectDirective<HTMLElement, string | null | undefined, 'noDelay' | 'mfm' | 'top' | 'right' | 'bottom' | 'left', 'dialog'> = {
mounted(src, binding) {
const delay = binding.modifiers.noDelay ? 0 : 100;
const self = (src as any)._tooltipDirective_ = {} as any;
@ -97,13 +104,13 @@ export const vTooltip: ObjectDirective<HTMLElement, string | null | undefined, '
});
},
updated(src, binding) {
async updated(src, binding) {
const self = (src as any)._tooltipDirective_;
self.text = binding.value as string;
},
unmounted(src) {
async unmounted(src) {
const self = (src as any)._tooltipDirective_;
window.clearInterval(self.checkTimer);
},
};
} satisfies VTooltip as VTooltip;

25
packages/frontend/src/directives/user-preview.ts
View file

@ -3,12 +3,13 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { defineAsyncComponent, ref } from 'vue';
import type { ObjectDirective } from 'vue';
import { type ObjectDirective, defineAsyncComponent, ref } from 'vue';
import { popup } from '@/os.js';
export const vUserPreview: ObjectDirective<HTMLElement, string | null | undefined> = {
mounted(src, binding) {
type VUserPreview = ObjectDirective<HTMLElement, string | null | undefined>;
export const vUserPreview = {
async mounted(src, binding) {
if (binding.value == null) return;
// TODO: 新たにプロパティを作るのをやめMapを使う
@ -18,21 +19,21 @@ export const vUserPreview: ObjectDirective<HTMLElement, string | null | undefine
self.preview = new UserPreview(src, binding.value);
},
unmounted(src, binding) {
async unmounted(src, binding) {
if (binding.value == null) return;
const self = src._userPreviewDirective_;
self.preview.detach();
},
};
} satisfies VUserPreview as VUserPreview;
class UserPreview {
private el: HTMLElement;
private user: string;
private showTimer: number | null = null;
private hideTimer: number | null = null;
private checkTimer: number | null = null;
private promise: { cancel: () => void } | null = null;
private el;
private user;
private showTimer;
private hideTimer;
private checkTimer;
private promise;
constructor(el, user) {
this.el = el;

130
packages/frontend/src/widgets/index.ts
View file

@ -3,40 +3,75 @@
* SPDX-License-Identifier: AGPL-3.0-only
*/
import { App, defineAsyncComponent } from 'vue';
import { type App, defineAsyncComponent } from 'vue';
const WidgetProfile = defineAsyncComponent(() => import('@/widgets/WidgetProfile.vue'));
const WidgetInstanceInfo = defineAsyncComponent(() => import('@/widgets/WidgetInstanceInfo.vue'));
const WidgetMemo = defineAsyncComponent(() => import('@/widgets/WidgetMemo.vue'));
const WidgetNotifications = defineAsyncComponent(() => import('@/widgets/WidgetNotifications.vue'));
const WidgetTimeline = defineAsyncComponent(() => import('@/widgets/WidgetTimeline.vue'));
const WidgetCalendar = defineAsyncComponent(() => import('@/widgets/WidgetCalendar.vue'));
const WidgetRss = defineAsyncComponent(() => import('@/widgets/WidgetRss.vue'));
const WidgetRssTicker = defineAsyncComponent(() => import('@/widgets/WidgetRssTicker.vue'));
const WidgetTrends = defineAsyncComponent(() => import('@/widgets/WidgetTrends.vue'));
const WidgetClock = defineAsyncComponent(() => import('@/widgets/WidgetClock.vue'));
const WidgetActivity = defineAsyncComponent(() => import('@/widgets/WidgetActivity.vue'));
const WidgetPhotos = defineAsyncComponent(() => import('@/widgets/WidgetPhotos.vue'));
const WidgetDigitalClock = defineAsyncComponent(() => import('@/widgets/WidgetDigitalClock.vue'));
const WidgetUnixClock = defineAsyncComponent(() => import('@/widgets/WidgetUnixClock.vue'));
const WidgetFederation = defineAsyncComponent(() => import('@/widgets/WidgetFederation.vue'));
const WidgetInstanceCloud = defineAsyncComponent(() => import('@/widgets/WidgetInstanceCloud.vue'));
const WidgetPostForm = defineAsyncComponent(() => import('@/widgets/WidgetPostForm.vue'));
const WidgetSlideshow = defineAsyncComponent(() => import('@/widgets/WidgetSlideshow.vue'));
const WidgetServerMetric = defineAsyncComponent(() => import('@/widgets/server-metric/index.vue'));
const WidgetOnlineUsers = defineAsyncComponent(() => import('@/widgets/WidgetOnlineUsers.vue'));
const WidgetJobQueue = defineAsyncComponent(() => import('@/widgets/WidgetJobQueue.vue'));
const WidgetButton = defineAsyncComponent(() => import('@/widgets/WidgetButton.vue'));
const WidgetAiscript = defineAsyncComponent(() => import('@/widgets/WidgetAiscript.vue'));
const WidgetAiscriptApp = defineAsyncComponent(() => import('@/widgets/WidgetAiscriptApp.vue'));
const WidgetAichan = defineAsyncComponent(() => import('@/widgets/WidgetAichan.vue'));
const WidgetUserList = defineAsyncComponent(() => import('@/widgets/WidgetUserList.vue'));
const WidgetClicker = defineAsyncComponent(() => import('@/widgets/WidgetClicker.vue'));
const WidgetBirthdayFollowings = defineAsyncComponent(() => import('@/widgets/WidgetBirthdayFollowings.vue'));
export default function(app: App) {
app.component('WidgetProfile', defineAsyncComponent(() => import('./WidgetProfile.vue')));
app.component('WidgetInstanceInfo', defineAsyncComponent(() => import('./WidgetInstanceInfo.vue')));
app.component('WidgetMemo', defineAsyncComponent(() => import('./WidgetMemo.vue')));
app.component('WidgetNotifications', defineAsyncComponent(() => import('./WidgetNotifications.vue')));
app.component('WidgetTimeline', defineAsyncComponent(() => import('./WidgetTimeline.vue')));
app.component('WidgetCalendar', defineAsyncComponent(() => import('./WidgetCalendar.vue')));
app.component('WidgetRss', defineAsyncComponent(() => import('./WidgetRss.vue')));
app.component('WidgetRssTicker', defineAsyncComponent(() => import('./WidgetRssTicker.vue')));
app.component('WidgetTrends', defineAsyncComponent(() => import('./WidgetTrends.vue')));
app.component('WidgetClock', defineAsyncComponent(() => import('./WidgetClock.vue')));
app.component('WidgetActivity', defineAsyncComponent(() => import('./WidgetActivity.vue')));
app.component('WidgetPhotos', defineAsyncComponent(() => import('./WidgetPhotos.vue')));
app.component('WidgetDigitalClock', defineAsyncComponent(() => import('./WidgetDigitalClock.vue')));
app.component('WidgetUnixClock', defineAsyncComponent(() => import('./WidgetUnixClock.vue')));
app.component('WidgetFederation', defineAsyncComponent(() => import('./WidgetFederation.vue')));
app.component('WidgetPostForm', defineAsyncComponent(() => import('./WidgetPostForm.vue')));
app.component('WidgetSlideshow', defineAsyncComponent(() => import('./WidgetSlideshow.vue')));
app.component('WidgetServerMetric', defineAsyncComponent(() => import('./server-metric/index.vue')));
app.component('WidgetOnlineUsers', defineAsyncComponent(() => import('./WidgetOnlineUsers.vue')));
app.component('WidgetJobQueue', defineAsyncComponent(() => import('./WidgetJobQueue.vue')));
app.component('WidgetInstanceCloud', defineAsyncComponent(() => import('./WidgetInstanceCloud.vue')));
app.component('WidgetButton', defineAsyncComponent(() => import('./WidgetButton.vue')));
app.component('WidgetAiscript', defineAsyncComponent(() => import('./WidgetAiscript.vue')));
app.component('WidgetAiscriptApp', defineAsyncComponent(() => import('./WidgetAiscriptApp.vue')));
app.component('WidgetAichan', defineAsyncComponent(() => import('./WidgetAichan.vue')));
app.component('WidgetUserList', defineAsyncComponent(() => import('./WidgetUserList.vue')));
app.component('WidgetClicker', defineAsyncComponent(() => import('./WidgetClicker.vue')));
app.component('WidgetBirthdayFollowings', defineAsyncComponent(() => import('./WidgetBirthdayFollowings.vue')));
for (const [key, value] of Object.entries(widgets)) {
app.component(key, value);
}
}
export const widgets = [
const widgets = {
WidgetProfile,
WidgetInstanceInfo,
WidgetMemo,
WidgetNotifications,
WidgetTimeline,
WidgetCalendar,
WidgetRss,
WidgetRssTicker,
WidgetTrends,
WidgetClock,
WidgetActivity,
WidgetPhotos,
WidgetDigitalClock,
WidgetUnixClock,
WidgetFederation,
WidgetInstanceCloud,
WidgetPostForm,
WidgetSlideshow,
WidgetServerMetric,
WidgetOnlineUsers,
WidgetJobQueue,
WidgetButton,
WidgetAiscript,
WidgetAiscriptApp,
WidgetAichan,
WidgetUserList,
WidgetClicker,
WidgetBirthdayFollowings,
} as const;
export const widgetDefs = [
'profile',
'instanceInfo',
'memo',
@ -65,4 +100,37 @@ export const widgets = [
'userList',
'clicker',
'birthdayFollowings',
];
] as const;
declare module '@vue/runtime-core' {
export interface GlobalComponents {
WidgetProfile: typeof WidgetProfile;
WidgetInstanceInfo: typeof WidgetInstanceInfo;
WidgetMemo: typeof WidgetMemo;
WidgetNotifications: typeof WidgetNotifications;
WidgetTimeline: typeof WidgetTimeline;
WidgetCalendar: typeof WidgetCalendar;
WidgetRss: typeof WidgetRss;
WidgetRssTicker: typeof WidgetRssTicker;
WidgetTrends: typeof WidgetTrends;
WidgetClock: typeof WidgetClock;
WidgetActivity: typeof WidgetActivity;
WidgetPhotos: typeof WidgetPhotos;
WidgetDigitalClock: typeof WidgetDigitalClock;
WidgetUnixClock: typeof WidgetUnixClock;
WidgetFederation: typeof WidgetFederation;
WidgetInstanceCloud: typeof WidgetInstanceCloud;
WidgetPostForm: typeof WidgetPostForm;
WidgetSlideshow: typeof WidgetSlideshow;
WidgetServerMetric: typeof WidgetServerMetric;
WidgetOnlineUsers: typeof WidgetOnlineUsers;
WidgetJobQueue: typeof WidgetJobQueue;
WidgetButton: typeof WidgetButton;
WidgetAiscript: typeof WidgetAiscript;
WidgetAiscriptApp: typeof WidgetAiscriptApp;
WidgetAichan: typeof WidgetAichan;
WidgetUserList: typeof WidgetUserList;
WidgetClicker: typeof WidgetClicker;
WidgetBirthdayFollowings: typeof WidgetBirthdayFollowings;
}
}

4
packages/frontend/test/emoji.test.ts
View file

@ -6,9 +6,9 @@
import { describe, test, assert, afterEach } from 'vitest';
import { render, cleanup, type RenderResult } from '@testing-library/vue';
import { defaultStoreState } from './init.js';
import { getEmojiName } from '@@/js/emojilist.js';
import { components } from '@/components/index.js';
import { getEmojiName } from '../../frontend-shared/js/emojilist.js';
import { directives } from '@/directives/index.js';
import { components } from '@/components/index.js';
import MkEmoji from '@/components/global/MkEmoji.vue';
describe('Emoji', () => {

2
packages/frontend/test/note.test.ts
View file

@ -7,8 +7,8 @@ import { describe, test, assert, afterEach } from 'vitest';
import { render, cleanup, type RenderResult } from '@testing-library/vue';
import './init';
import type * as Misskey from 'misskey-js';
import { components } from '@/components/index.js';
import { directives } from '@/directives/index.js';
import { components } from '@/components/index.js';
import MkMediaImage from '@/components/MkMediaImage.vue';
describe('MkMediaImage', () => {

2
packages/frontend/test/url-preview.test.ts
View file

@ -7,8 +7,8 @@ import { describe, test, assert, afterEach } from 'vitest';
import { render, cleanup, type RenderResult } from '@testing-library/vue';
import './init';
import type { summaly } from '@misskey-dev/summaly';
import { components } from '@/components/index.js';
import { directives } from '@/directives/index.js';
import { components } from '@/components/index.js';
import MkUrlPreview from '@/components/MkUrlPreview.vue';
type SummalyResult = Awaited<ReturnType<typeof summaly>>;