mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-30 11:11:53 +00:00
refactor usage of isElectron to use isDesktop
This commit is contained in:
committed by
Christian Byrne
parent
c6b528b8be
commit
3324da56c2
@@ -1,10 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
ref="rootEl"
|
ref="rootEl"
|
||||||
class="relative overflow-hidden h-full w-full bg-neutral-900"
|
class="relative h-full w-full overflow-hidden bg-neutral-900"
|
||||||
>
|
>
|
||||||
<div class="p-terminal rounded-none h-full w-full p-2">
|
<div class="p-terminal h-full w-full rounded-none p-2">
|
||||||
<div ref="terminalEl" class="h-full terminal-host" />
|
<div ref="terminalEl" class="terminal-host h-full" />
|
||||||
</div>
|
</div>
|
||||||
<Button
|
<Button
|
||||||
v-tooltip.left="{
|
v-tooltip.left="{
|
||||||
@@ -26,6 +26,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { isDesktop } from '@frontend/platform/distribution/types'
|
||||||
import { useElementHover, useEventListener } from '@vueuse/core'
|
import { useElementHover, useEventListener } from '@vueuse/core'
|
||||||
import type { IDisposable } from '@xterm/xterm'
|
import type { IDisposable } from '@xterm/xterm'
|
||||||
import Button from 'primevue/button'
|
import Button from 'primevue/button'
|
||||||
@@ -34,7 +35,7 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
|
|||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
|
|
||||||
import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
|
import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
|
||||||
import { electronAPI, isElectron } from '@/utils/envUtil'
|
import { electronAPI } from '@/utils/envUtil'
|
||||||
import { cn } from '@/utils/tailwindUtil'
|
import { cn } from '@/utils/tailwindUtil'
|
||||||
|
|
||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
@@ -84,7 +85,7 @@ const showContextMenu = (event: MouseEvent) => {
|
|||||||
electronAPI()?.showContextMenu({ type: 'text' })
|
electronAPI()?.showContextMenu({ type: 'text' })
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
useEventListener(terminalEl, 'contextmenu', showContextMenu)
|
useEventListener(terminalEl, 'contextmenu', showContextMenu)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,14 +1,14 @@
|
|||||||
|
import { isDesktop } from '@frontend/platform/distribution/types'
|
||||||
import {
|
import {
|
||||||
createRouter,
|
createRouter,
|
||||||
createWebHashHistory,
|
createWebHashHistory,
|
||||||
createWebHistory
|
createWebHistory
|
||||||
} from 'vue-router'
|
} from 'vue-router'
|
||||||
|
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
|
import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
|
||||||
|
|
||||||
const isFileProtocol = window.location.protocol === 'file:'
|
const isFileProtocol = window.location.protocol === 'file:'
|
||||||
const basePath = isElectron() ? '/' : window.location.pathname
|
const basePath = isDesktop ? '/' : window.location.pathname
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
history: isFileProtocol ? createWebHashHistory() : createWebHistory(basePath),
|
history: isFileProtocol ? createWebHashHistory() : createWebHistory(basePath),
|
||||||
|
|||||||
@@ -1,13 +1 @@
|
|||||||
import type { ElectronAPI } from '@comfyorg/comfyui-electron-types'
|
export { electronAPI, isNativeWindow } from '@frontend/utils/envUtil'
|
||||||
|
|
||||||
export function isElectron() {
|
|
||||||
return 'electronAPI' in window && window.electronAPI !== undefined
|
|
||||||
}
|
|
||||||
|
|
||||||
export function electronAPI() {
|
|
||||||
return (window as any).electronAPI as ElectronAPI
|
|
||||||
}
|
|
||||||
|
|
||||||
export function isNativeWindow() {
|
|
||||||
return isElectron() && !!window.navigator.windowControlsOverlay?.visible
|
|
||||||
}
|
|
||||||
|
|||||||
@@ -1,28 +1,29 @@
|
|||||||
<template>
|
<template>
|
||||||
<div
|
<div
|
||||||
class="font-sans w-screen h-screen flex flex-col"
|
class="flex h-screen w-screen flex-col font-sans"
|
||||||
:class="[
|
:class="[
|
||||||
dark
|
dark
|
||||||
? 'text-neutral-300 bg-neutral-900 dark-theme'
|
? 'dark-theme bg-neutral-900 text-neutral-300'
|
||||||
: 'text-neutral-900 bg-neutral-300'
|
: 'bg-neutral-300 text-neutral-900'
|
||||||
]"
|
]"
|
||||||
>
|
>
|
||||||
<!-- Virtual top menu for native window (drag handle) -->
|
<!-- Virtual top menu for native window (drag handle) -->
|
||||||
<div
|
<div
|
||||||
v-show="isNativeWindow()"
|
v-show="isNativeWindow()"
|
||||||
ref="topMenuRef"
|
ref="topMenuRef"
|
||||||
class="app-drag w-full h-(--comfy-topbar-height)"
|
class="app-drag h-(--comfy-topbar-height) w-full"
|
||||||
/>
|
/>
|
||||||
<div class="grow w-full flex items-center justify-center overflow-auto">
|
<div class="flex w-full grow items-center justify-center overflow-auto">
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
import { isDesktop } from '@frontend/platform/distribution/types'
|
||||||
import { nextTick, onMounted, ref } from 'vue'
|
import { nextTick, onMounted, ref } from 'vue'
|
||||||
|
|
||||||
import { electronAPI, isElectron, isNativeWindow } from '../../utils/envUtil'
|
import { electronAPI, isNativeWindow } from '../../utils/envUtil'
|
||||||
|
|
||||||
const { dark = false } = defineProps<{
|
const { dark = false } = defineProps<{
|
||||||
dark?: boolean
|
dark?: boolean
|
||||||
@@ -40,7 +41,7 @@ const lightTheme = {
|
|||||||
|
|
||||||
const topMenuRef = ref<HTMLDivElement | null>(null)
|
const topMenuRef = ref<HTMLDivElement | null>(null)
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
await nextTick()
|
await nextTick()
|
||||||
|
|
||||||
electronAPI().changeTheme({
|
electronAPI().changeTheme({
|
||||||
|
|||||||
@@ -6,6 +6,7 @@
|
|||||||
"baseUrl": ".",
|
"baseUrl": ".",
|
||||||
"paths": {
|
"paths": {
|
||||||
"@/*": ["src/*"],
|
"@/*": ["src/*"],
|
||||||
|
"@frontend/*": ["../../src/*"],
|
||||||
"@frontend-locales/*": ["../../src/locales/*"]
|
"@frontend-locales/*": ["../../src/locales/*"]
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -31,6 +31,7 @@ export default defineConfig(() => {
|
|||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
'@': path.resolve(projectRoot, 'src'),
|
'@': path.resolve(projectRoot, 'src'),
|
||||||
|
'@frontend': path.resolve(projectRoot, '../../src'),
|
||||||
'@frontend-locales': path.resolve(projectRoot, '../../src/locales')
|
'@frontend-locales': path.resolve(projectRoot, '../../src/locales')
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -16,10 +16,11 @@ import { computed, onMounted } from 'vue'
|
|||||||
|
|
||||||
import GlobalDialog from '@/components/dialog/GlobalDialog.vue'
|
import GlobalDialog from '@/components/dialog/GlobalDialog.vue'
|
||||||
import config from '@/config'
|
import config from '@/config'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
||||||
import { useConflictDetection } from '@/workbench/extensions/manager/composables/useConflictDetection'
|
import { useConflictDetection } from '@/workbench/extensions/manager/composables/useConflictDetection'
|
||||||
|
|
||||||
import { electronAPI, isElectron } from './utils/envUtil'
|
import { electronAPI } from './utils/envUtil'
|
||||||
|
|
||||||
const workspaceStore = useWorkspaceStore()
|
const workspaceStore = useWorkspaceStore()
|
||||||
const conflictDetection = useConflictDetection()
|
const conflictDetection = useConflictDetection()
|
||||||
@@ -45,7 +46,7 @@ onMounted(() => {
|
|||||||
// @ts-expect-error fixme ts strict error
|
// @ts-expect-error fixme ts strict error
|
||||||
window['__COMFYUI_FRONTEND_VERSION__'] = config.app_version
|
window['__COMFYUI_FRONTEND_VERSION__'] = config.app_version
|
||||||
|
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
document.addEventListener('contextmenu', showContextMenu)
|
document.addEventListener('contextmenu', showContextMenu)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -34,7 +34,8 @@ import { computed, onMounted, onUnmounted, ref } from 'vue'
|
|||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
|
|
||||||
import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
|
import { useTerminal } from '@/composables/bottomPanelTabs/useTerminal'
|
||||||
import { electronAPI, isElectron } from '@/utils/envUtil'
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
|
import { electronAPI } from '@/utils/envUtil'
|
||||||
import { cn } from '@/utils/tailwindUtil'
|
import { cn } from '@/utils/tailwindUtil'
|
||||||
|
|
||||||
const { t } = useI18n()
|
const { t } = useI18n()
|
||||||
@@ -84,7 +85,7 @@ const showContextMenu = (event: MouseEvent) => {
|
|||||||
electronAPI()?.showContextMenu({ type: 'text' })
|
electronAPI()?.showContextMenu({ type: 'text' })
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
useEventListener(terminalEl, 'contextmenu', showContextMenu)
|
useEventListener(terminalEl, 'contextmenu', showContextMenu)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -13,7 +13,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<ListBox :options="missingModels" class="comfy-missing-models">
|
<ListBox :options="missingModels" class="comfy-missing-models">
|
||||||
<template #option="{ option }">
|
<template #option="{ option }">
|
||||||
<Suspense v-if="isElectron()">
|
<Suspense v-if="isDesktop">
|
||||||
<ElectronFileDownload
|
<ElectronFileDownload
|
||||||
:url="option.url"
|
:url="option.url"
|
||||||
:label="option.label"
|
:label="option.label"
|
||||||
@@ -39,8 +39,8 @@ import { useI18n } from 'vue-i18n'
|
|||||||
import ElectronFileDownload from '@/components/common/ElectronFileDownload.vue'
|
import ElectronFileDownload from '@/components/common/ElectronFileDownload.vue'
|
||||||
import FileDownload from '@/components/common/FileDownload.vue'
|
import FileDownload from '@/components/common/FileDownload.vue'
|
||||||
import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
|
import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useSettingStore } from '@/platform/settings/settingStore'
|
import { useSettingStore } from '@/platform/settings/settingStore'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
|
|
||||||
// TODO: Read this from server internal API rather than hardcoding here
|
// TODO: Read this from server internal API rather than hardcoding here
|
||||||
// as some installations may wish to use custom sources
|
// as some installations may wish to use custom sources
|
||||||
|
|||||||
@@ -135,12 +135,12 @@ import type { CSSProperties, Component } from 'vue'
|
|||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
|
|
||||||
import PuzzleIcon from '@/components/icons/PuzzleIcon.vue'
|
import PuzzleIcon from '@/components/icons/PuzzleIcon.vue'
|
||||||
import { isCloud } from '@/platform/distribution/types'
|
import { isCloud, isDesktop } from '@/platform/distribution/types'
|
||||||
import { useSettingStore } from '@/platform/settings/settingStore'
|
import { useSettingStore } from '@/platform/settings/settingStore'
|
||||||
import type { ReleaseNote } from '@/platform/updates/common/releaseService'
|
import type { ReleaseNote } from '@/platform/updates/common/releaseService'
|
||||||
import { useReleaseStore } from '@/platform/updates/common/releaseStore'
|
import { useReleaseStore } from '@/platform/updates/common/releaseStore'
|
||||||
import { useCommandStore } from '@/stores/commandStore'
|
import { useCommandStore } from '@/stores/commandStore'
|
||||||
import { electronAPI, isElectron } from '@/utils/envUtil'
|
import { electronAPI } from '@/utils/envUtil'
|
||||||
import { formatVersionAnchor } from '@/utils/formatUtil'
|
import { formatVersionAnchor } from '@/utils/formatUtil'
|
||||||
import { useConflictAcknowledgment } from '@/workbench/extensions/manager/composables/useConflictAcknowledgment'
|
import { useConflictAcknowledgment } from '@/workbench/extensions/manager/composables/useConflictAcknowledgment'
|
||||||
import { useManagerState } from '@/workbench/extensions/manager/composables/useManagerState'
|
import { useManagerState } from '@/workbench/extensions/manager/composables/useManagerState'
|
||||||
@@ -216,7 +216,7 @@ const moreItems = computed<MenuItem[]>(() => {
|
|||||||
key: 'desktop-guide',
|
key: 'desktop-guide',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
label: t('helpCenter.desktopUserGuide'),
|
label: t('helpCenter.desktopUserGuide'),
|
||||||
visible: isElectron(),
|
visible: isDesktop,
|
||||||
action: () => {
|
action: () => {
|
||||||
const docsUrl =
|
const docsUrl =
|
||||||
electronAPI().getPlatform() === 'darwin'
|
electronAPI().getPlatform() === 'darwin'
|
||||||
@@ -230,7 +230,7 @@ const moreItems = computed<MenuItem[]>(() => {
|
|||||||
key: 'dev-tools',
|
key: 'dev-tools',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
label: t('helpCenter.openDevTools'),
|
label: t('helpCenter.openDevTools'),
|
||||||
visible: isElectron(),
|
visible: isDesktop,
|
||||||
action: () => {
|
action: () => {
|
||||||
openDevTools()
|
openDevTools()
|
||||||
emit('close')
|
emit('close')
|
||||||
@@ -239,13 +239,13 @@ const moreItems = computed<MenuItem[]>(() => {
|
|||||||
{
|
{
|
||||||
key: 'divider-1',
|
key: 'divider-1',
|
||||||
type: 'divider',
|
type: 'divider',
|
||||||
visible: isElectron()
|
visible: isDesktop
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'reinstall',
|
key: 'reinstall',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
label: t('helpCenter.reinstall'),
|
label: t('helpCenter.reinstall'),
|
||||||
visible: isElectron(),
|
visible: isDesktop,
|
||||||
action: () => {
|
action: () => {
|
||||||
onReinstall()
|
onReinstall()
|
||||||
emit('close')
|
emit('close')
|
||||||
@@ -484,13 +484,13 @@ const onSubmenuLeave = (): void => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const openDevTools = (): void => {
|
const openDevTools = (): void => {
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
electronAPI().openDevTools()
|
electronAPI().openDevTools()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const onReinstall = (): void => {
|
const onReinstall = (): void => {
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
void electronAPI().reinstall()
|
void electronAPI().reinstall()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -28,7 +28,7 @@
|
|||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
<template #body>
|
<template #body>
|
||||||
<ElectronDownloadItems v-if="isElectron()" />
|
<ElectronDownloadItems v-if="isDesktop" />
|
||||||
|
|
||||||
<TreeExplorer
|
<TreeExplorer
|
||||||
v-model:expanded-keys="expandedKeys"
|
v-model:expanded-keys="expandedKeys"
|
||||||
@@ -54,13 +54,13 @@ import SidebarTabTemplate from '@/components/sidebar/tabs/SidebarTabTemplate.vue
|
|||||||
import ElectronDownloadItems from '@/components/sidebar/tabs/modelLibrary/ElectronDownloadItems.vue'
|
import ElectronDownloadItems from '@/components/sidebar/tabs/modelLibrary/ElectronDownloadItems.vue'
|
||||||
import ModelTreeLeaf from '@/components/sidebar/tabs/modelLibrary/ModelTreeLeaf.vue'
|
import ModelTreeLeaf from '@/components/sidebar/tabs/modelLibrary/ModelTreeLeaf.vue'
|
||||||
import { useTreeExpansion } from '@/composables/useTreeExpansion'
|
import { useTreeExpansion } from '@/composables/useTreeExpansion'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useSettingStore } from '@/platform/settings/settingStore'
|
import { useSettingStore } from '@/platform/settings/settingStore'
|
||||||
import { useLitegraphService } from '@/services/litegraphService'
|
import { useLitegraphService } from '@/services/litegraphService'
|
||||||
import type { ComfyModelDef, ModelFolder } from '@/stores/modelStore'
|
import type { ComfyModelDef, ModelFolder } from '@/stores/modelStore'
|
||||||
import { ResourceState, useModelStore } from '@/stores/modelStore'
|
import { ResourceState, useModelStore } from '@/stores/modelStore'
|
||||||
import { useModelToNodeStore } from '@/stores/modelToNodeStore'
|
import { useModelToNodeStore } from '@/stores/modelToNodeStore'
|
||||||
import type { TreeExplorerNode, TreeNode } from '@/types/treeExplorerTypes'
|
import type { TreeExplorerNode, TreeNode } from '@/types/treeExplorerTypes'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
import { buildTree } from '@/utils/treeUtil'
|
import { buildTree } from '@/utils/treeUtil'
|
||||||
|
|
||||||
const modelStore = useModelStore()
|
const modelStore = useModelStore()
|
||||||
|
|||||||
@@ -79,6 +79,7 @@ import { useI18n } from 'vue-i18n'
|
|||||||
|
|
||||||
import WorkflowTab from '@/components/topbar/WorkflowTab.vue'
|
import WorkflowTab from '@/components/topbar/WorkflowTab.vue'
|
||||||
import { useOverflowObserver } from '@/composables/element/useOverflowObserver'
|
import { useOverflowObserver } from '@/composables/element/useOverflowObserver'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
|
import { useWorkflowService } from '@/platform/workflow/core/services/workflowService'
|
||||||
import type { ComfyWorkflow } from '@/platform/workflow/management/stores/workflowStore'
|
import type { ComfyWorkflow } from '@/platform/workflow/management/stores/workflowStore'
|
||||||
import {
|
import {
|
||||||
@@ -87,7 +88,6 @@ import {
|
|||||||
} from '@/platform/workflow/management/stores/workflowStore'
|
} from '@/platform/workflow/management/stores/workflowStore'
|
||||||
import { useCommandStore } from '@/stores/commandStore'
|
import { useCommandStore } from '@/stores/commandStore'
|
||||||
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
import { whileMouseDown } from '@/utils/mouseDownUtil'
|
import { whileMouseDown } from '@/utils/mouseDownUtil'
|
||||||
|
|
||||||
import WorkflowOverflowMenu from './WorkflowOverflowMenu.vue'
|
import WorkflowOverflowMenu from './WorkflowOverflowMenu.vue'
|
||||||
@@ -114,8 +114,6 @@ const showOverflowArrows = ref(false)
|
|||||||
const leftArrowEnabled = ref(false)
|
const leftArrowEnabled = ref(false)
|
||||||
const rightArrowEnabled = ref(false)
|
const rightArrowEnabled = ref(false)
|
||||||
|
|
||||||
const isDesktop = isElectron()
|
|
||||||
|
|
||||||
const workflowToOption = (workflow: ComfyWorkflow): WorkflowOption => ({
|
const workflowToOption = (workflow: ComfyWorkflow): WorkflowOption => ({
|
||||||
value: workflow.path,
|
value: workflow.path,
|
||||||
workflow
|
workflow
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
import { markRaw } from 'vue'
|
import { markRaw } from 'vue'
|
||||||
|
|
||||||
import ModelLibrarySidebarTab from '@/components/sidebar/tabs/ModelLibrarySidebarTab.vue'
|
import ModelLibrarySidebarTab from '@/components/sidebar/tabs/ModelLibrarySidebarTab.vue'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useElectronDownloadStore } from '@/stores/electronDownloadStore'
|
import { useElectronDownloadStore } from '@/stores/electronDownloadStore'
|
||||||
import type { SidebarTabExtension } from '@/types/extensionTypes'
|
import type { SidebarTabExtension } from '@/types/extensionTypes'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
|
|
||||||
export const useModelLibrarySidebarTab = (): SidebarTabExtension => {
|
export const useModelLibrarySidebarTab = (): SidebarTabExtension => {
|
||||||
return {
|
return {
|
||||||
@@ -15,7 +15,7 @@ export const useModelLibrarySidebarTab = (): SidebarTabExtension => {
|
|||||||
component: markRaw(ModelLibrarySidebarTab),
|
component: markRaw(ModelLibrarySidebarTab),
|
||||||
type: 'vue',
|
type: 'vue',
|
||||||
iconBadge: () => {
|
iconBadge: () => {
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
const electronDownloadStore = useElectronDownloadStore()
|
const electronDownloadStore = useElectronDownloadStore()
|
||||||
if (electronDownloadStore.inProgressDownloads.length > 0) {
|
if (electronDownloadStore.inProgressDownloads.length > 0) {
|
||||||
return electronDownloadStore.inProgressDownloads.length.toString()
|
return electronDownloadStore.inProgressDownloads.length.toString()
|
||||||
|
|||||||
@@ -2,12 +2,13 @@ import log from 'loglevel'
|
|||||||
|
|
||||||
import { PYTHON_MIRROR } from '@/constants/uvMirrors'
|
import { PYTHON_MIRROR } from '@/constants/uvMirrors'
|
||||||
import { t } from '@/i18n'
|
import { t } from '@/i18n'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useToastStore } from '@/platform/updates/common/toastStore'
|
import { useToastStore } from '@/platform/updates/common/toastStore'
|
||||||
import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
|
import { useWorkflowStore } from '@/platform/workflow/management/stores/workflowStore'
|
||||||
import { app } from '@/scripts/app'
|
import { app } from '@/scripts/app'
|
||||||
import { useDialogService } from '@/services/dialogService'
|
import { useDialogService } from '@/services/dialogService'
|
||||||
import { checkMirrorReachable } from '@/utils/electronMirrorCheck'
|
import { checkMirrorReachable } from '@/utils/electronMirrorCheck'
|
||||||
import { electronAPI as getElectronAPI, isElectron } from '@/utils/envUtil'
|
import { electronAPI as getElectronAPI } from '@/utils/envUtil'
|
||||||
|
|
||||||
// Desktop documentation URLs
|
// Desktop documentation URLs
|
||||||
const DESKTOP_DOCS = {
|
const DESKTOP_DOCS = {
|
||||||
@@ -16,7 +17,7 @@ const DESKTOP_DOCS = {
|
|||||||
} as const
|
} as const
|
||||||
|
|
||||||
;(async () => {
|
;(async () => {
|
||||||
if (!isElectron()) return
|
if (!isDesktop) return
|
||||||
|
|
||||||
const electronAPI = getElectronAPI()
|
const electronAPI = getElectronAPI()
|
||||||
const desktopAppVersion = await electronAPI.getElectronVersion()
|
const desktopAppVersion = await electronAPI.getElectronVersion()
|
||||||
|
|||||||
@@ -3,10 +3,10 @@ import type { Component } from 'vue'
|
|||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
|
|
||||||
import { useCurrentUser } from '@/composables/auth/useCurrentUser'
|
import { useCurrentUser } from '@/composables/auth/useCurrentUser'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import type { SettingTreeNode } from '@/platform/settings/settingStore'
|
import type { SettingTreeNode } from '@/platform/settings/settingStore'
|
||||||
import { useSettingStore } from '@/platform/settings/settingStore'
|
import { useSettingStore } from '@/platform/settings/settingStore'
|
||||||
import type { SettingParams } from '@/platform/settings/types'
|
import type { SettingParams } from '@/platform/settings/types'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
import { normalizeI18nKey } from '@/utils/formatUtil'
|
import { normalizeI18nKey } from '@/utils/formatUtil'
|
||||||
import { buildTree } from '@/utils/treeUtil'
|
import { buildTree } from '@/utils/treeUtil'
|
||||||
|
|
||||||
@@ -129,7 +129,7 @@ export function useSettingUI(
|
|||||||
userPanel,
|
userPanel,
|
||||||
keybindingPanel,
|
keybindingPanel,
|
||||||
extensionPanel,
|
extensionPanel,
|
||||||
...(isElectron() ? [serverConfigPanel] : [])
|
...(isDesktop ? [serverConfigPanel] : [])
|
||||||
].filter((panel) => panel.component)
|
].filter((panel) => panel.component)
|
||||||
)
|
)
|
||||||
|
|
||||||
@@ -178,7 +178,7 @@ export function useSettingUI(
|
|||||||
keybindingPanel.node,
|
keybindingPanel.node,
|
||||||
extensionPanel.node,
|
extensionPanel.node,
|
||||||
aboutPanel.node,
|
aboutPanel.node,
|
||||||
...(isElectron() ? [serverConfigPanel.node] : [])
|
...(isDesktop ? [serverConfigPanel.node] : [])
|
||||||
].map(translateCategory)
|
].map(translateCategory)
|
||||||
}
|
}
|
||||||
])
|
])
|
||||||
|
|||||||
@@ -3,9 +3,9 @@ import { defineStore } from 'pinia'
|
|||||||
import { compare } from 'semver'
|
import { compare } from 'semver'
|
||||||
import { computed, ref } from 'vue'
|
import { computed, ref } from 'vue'
|
||||||
|
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useSettingStore } from '@/platform/settings/settingStore'
|
import { useSettingStore } from '@/platform/settings/settingStore'
|
||||||
import { useSystemStatsStore } from '@/stores/systemStatsStore'
|
import { useSystemStatsStore } from '@/stores/systemStatsStore'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
import { stringToLocale } from '@/utils/formatUtil'
|
import { stringToLocale } from '@/utils/formatUtil'
|
||||||
|
|
||||||
import { useReleaseService } from './releaseService'
|
import { useReleaseService } from './releaseService'
|
||||||
@@ -81,7 +81,7 @@ export const useReleaseStore = defineStore('release', () => {
|
|||||||
// Show toast if needed
|
// Show toast if needed
|
||||||
const shouldShowToast = computed(() => {
|
const shouldShowToast = computed(() => {
|
||||||
// Only show on desktop version
|
// Only show on desktop version
|
||||||
if (!isElectron()) {
|
if (!isDesktop) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -113,7 +113,7 @@ export const useReleaseStore = defineStore('release', () => {
|
|||||||
// Show red-dot indicator
|
// Show red-dot indicator
|
||||||
const shouldShowRedDot = computed(() => {
|
const shouldShowRedDot = computed(() => {
|
||||||
// Only show on desktop version
|
// Only show on desktop version
|
||||||
if (!isElectron()) {
|
if (!isDesktop) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -160,7 +160,7 @@ export const useReleaseStore = defineStore('release', () => {
|
|||||||
// Show "What's New" popup
|
// Show "What's New" popup
|
||||||
const shouldShowPopup = computed(() => {
|
const shouldShowPopup = computed(() => {
|
||||||
// Only show on desktop version
|
// Only show on desktop version
|
||||||
if (!isElectron()) {
|
if (!isDesktop) {
|
||||||
return false
|
return false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -4,13 +4,13 @@ import {
|
|||||||
createWebHistory
|
createWebHistory
|
||||||
} from 'vue-router'
|
} from 'vue-router'
|
||||||
|
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
|
import LayoutDefault from '@/views/layouts/LayoutDefault.vue'
|
||||||
|
|
||||||
import { useUserStore } from './stores/userStore'
|
import { useUserStore } from './stores/userStore'
|
||||||
import { isElectron } from './utils/envUtil'
|
|
||||||
|
|
||||||
const isFileProtocol = window.location.protocol === 'file:'
|
const isFileProtocol = window.location.protocol === 'file:'
|
||||||
const basePath = isElectron() ? '/' : window.location.pathname
|
const basePath = isDesktop ? '/' : window.location.pathname
|
||||||
|
|
||||||
const router = createRouter({
|
const router = createRouter({
|
||||||
history: isFileProtocol
|
history: isFileProtocol
|
||||||
|
|||||||
@@ -1,8 +1,9 @@
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
|
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import type { AboutPageBadge } from '@/types/comfy'
|
import type { AboutPageBadge } from '@/types/comfy'
|
||||||
import { electronAPI, isElectron } from '@/utils/envUtil'
|
import { electronAPI } from '@/utils/envUtil'
|
||||||
|
|
||||||
import { useExtensionStore } from './extensionStore'
|
import { useExtensionStore } from './extensionStore'
|
||||||
import { useSystemStatsStore } from './systemStatsStore'
|
import { useSystemStatsStore } from './systemStatsStore'
|
||||||
@@ -20,9 +21,7 @@ export const useAboutPanelStore = defineStore('aboutPanel', () => {
|
|||||||
// so the python server's API doesn't have the version info.
|
// so the python server's API doesn't have the version info.
|
||||||
{
|
{
|
||||||
label: `ComfyUI ${
|
label: `ComfyUI ${
|
||||||
isElectron()
|
isDesktop ? 'v' + electronAPI().getComfyUIVersion() : coreVersion.value
|
||||||
? 'v' + electronAPI().getComfyUIVersion()
|
|
||||||
: coreVersion.value
|
|
||||||
}`,
|
}`,
|
||||||
url: 'https://github.com/comfyanonymous/ComfyUI',
|
url: 'https://github.com/comfyanonymous/ComfyUI',
|
||||||
icon: 'pi pi-github'
|
icon: 'pi pi-github'
|
||||||
|
|||||||
@@ -3,7 +3,8 @@ import type { DownloadState } from '@comfyorg/comfyui-electron-types'
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { computed, ref } from 'vue'
|
import { computed, ref } from 'vue'
|
||||||
|
|
||||||
import { electronAPI, isElectron } from '@/utils/envUtil'
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
|
import { electronAPI } from '@/utils/envUtil'
|
||||||
|
|
||||||
export interface ElectronDownload
|
export interface ElectronDownload
|
||||||
extends Pick<DownloadState, 'url' | 'filename'> {
|
extends Pick<DownloadState, 'url' | 'filename'> {
|
||||||
@@ -21,7 +22,7 @@ export const useElectronDownloadStore = defineStore('downloads', () => {
|
|||||||
downloads.value.find((download) => url === download.url)
|
downloads.value.find((download) => url === download.url)
|
||||||
|
|
||||||
const initialize = async () => {
|
const initialize = async () => {
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
const allDownloads = await DownloadManager.getAllDownloads()
|
const allDownloads = await DownloadManager.getAllDownloads()
|
||||||
|
|
||||||
for (const download of allDownloads) {
|
for (const download of allDownloads) {
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
import { useAsyncState } from '@vueuse/core'
|
import { useAsyncState } from '@vueuse/core'
|
||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
|
|
||||||
|
import { isDesktop as isDesktopDistribution } from '@/platform/distribution/types'
|
||||||
import type { SystemStats } from '@/schemas/apiSchema'
|
import type { SystemStats } from '@/schemas/apiSchema'
|
||||||
import { api } from '@/scripts/api'
|
import { api } from '@/scripts/api'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
|
|
||||||
export const useSystemStatsStore = defineStore('systemStats', () => {
|
export const useSystemStatsStore = defineStore('systemStats', () => {
|
||||||
const fetchSystemStatsData = async () => {
|
const fetchSystemStatsData = async () => {
|
||||||
@@ -35,7 +35,7 @@ export const useSystemStatsStore = defineStore('systemStats', () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const os = systemStats.value.system.os.toLowerCase()
|
const os = systemStats.value.system.os.toLowerCase()
|
||||||
const isDesktop = isElectron()
|
const isDesktop = isDesktopDistribution
|
||||||
|
|
||||||
if (isDesktop) {
|
if (isDesktop) {
|
||||||
if (os.includes('windows')) {
|
if (os.includes('windows')) {
|
||||||
|
|||||||
@@ -6,10 +6,10 @@ import {
|
|||||||
useCommandTerminalTab,
|
useCommandTerminalTab,
|
||||||
useLogsTerminalTab
|
useLogsTerminalTab
|
||||||
} from '@/composables/bottomPanelTabs/useTerminalTabs'
|
} from '@/composables/bottomPanelTabs/useTerminalTabs'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useCommandStore } from '@/stores/commandStore'
|
import { useCommandStore } from '@/stores/commandStore'
|
||||||
import type { ComfyExtension } from '@/types/comfy'
|
import type { ComfyExtension } from '@/types/comfy'
|
||||||
import type { BottomPanelExtension } from '@/types/extensionTypes'
|
import type { BottomPanelExtension } from '@/types/extensionTypes'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
|
|
||||||
type PanelType = 'terminal' | 'shortcuts'
|
type PanelType = 'terminal' | 'shortcuts'
|
||||||
|
|
||||||
@@ -123,7 +123,7 @@ export const useBottomPanelStore = defineStore('bottomPanel', () => {
|
|||||||
|
|
||||||
const registerCoreBottomPanelTabs = () => {
|
const registerCoreBottomPanelTabs = () => {
|
||||||
registerBottomPanelTab(useLogsTerminalTab())
|
registerBottomPanelTab(useLogsTerminalTab())
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
registerBottomPanelTab(useCommandTerminalTab())
|
registerBottomPanelTab(useCommandTerminalTab())
|
||||||
}
|
}
|
||||||
useShortcutsTab().forEach(registerBottomPanelTab)
|
useShortcutsTab().forEach(registerBottomPanelTab)
|
||||||
|
|||||||
@@ -15,7 +15,7 @@
|
|||||||
|
|
||||||
<GlobalToast />
|
<GlobalToast />
|
||||||
<RerouteMigrationToast />
|
<RerouteMigrationToast />
|
||||||
<UnloadWindowConfirmDialog v-if="!isElectron()" />
|
<UnloadWindowConfirmDialog v-if="!isDesktop" />
|
||||||
<MenuHamburger />
|
<MenuHamburger />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -46,6 +46,7 @@ import { useErrorHandling } from '@/composables/useErrorHandling'
|
|||||||
import { useProgressFavicon } from '@/composables/useProgressFavicon'
|
import { useProgressFavicon } from '@/composables/useProgressFavicon'
|
||||||
import { SERVER_CONFIG_ITEMS } from '@/constants/serverConfig'
|
import { SERVER_CONFIG_ITEMS } from '@/constants/serverConfig'
|
||||||
import { i18n } from '@/i18n'
|
import { i18n } from '@/i18n'
|
||||||
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
import { useSettingStore } from '@/platform/settings/settingStore'
|
import { useSettingStore } from '@/platform/settings/settingStore'
|
||||||
import { useFrontendVersionMismatchWarning } from '@/platform/updates/common/useFrontendVersionMismatchWarning'
|
import { useFrontendVersionMismatchWarning } from '@/platform/updates/common/useFrontendVersionMismatchWarning'
|
||||||
import { useVersionCompatibilityStore } from '@/platform/updates/common/versionCompatibilityStore'
|
import { useVersionCompatibilityStore } from '@/platform/updates/common/versionCompatibilityStore'
|
||||||
@@ -68,7 +69,7 @@ import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
|
|||||||
import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
|
import { useColorPaletteStore } from '@/stores/workspace/colorPaletteStore'
|
||||||
import { useSidebarTabStore } from '@/stores/workspace/sidebarTabStore'
|
import { useSidebarTabStore } from '@/stores/workspace/sidebarTabStore'
|
||||||
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
import { useWorkspaceStore } from '@/stores/workspaceStore'
|
||||||
import { electronAPI, isElectron } from '@/utils/envUtil'
|
import { electronAPI } from '@/utils/envUtil'
|
||||||
|
|
||||||
setupAutoQueueHandler()
|
setupAutoQueueHandler()
|
||||||
useProgressFavicon()
|
useProgressFavicon()
|
||||||
@@ -93,7 +94,7 @@ watch(
|
|||||||
document.body.classList.add(DARK_THEME_CLASS)
|
document.body.classList.add(DARK_THEME_CLASS)
|
||||||
}
|
}
|
||||||
|
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
electronAPI().changeTheme({
|
electronAPI().changeTheme({
|
||||||
color: 'rgba(0, 0, 0, 0)',
|
color: 'rgba(0, 0, 0, 0)',
|
||||||
symbolColor: newTheme.colors.comfy_base['input-text']
|
symbolColor: newTheme.colors.comfy_base['input-text']
|
||||||
@@ -103,7 +104,7 @@ watch(
|
|||||||
{ immediate: true }
|
{ immediate: true }
|
||||||
)
|
)
|
||||||
|
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
watch(
|
watch(
|
||||||
() => queueStore.tasks,
|
() => queueStore.tasks,
|
||||||
(newTasks, oldTasks) => {
|
(newTasks, oldTasks) => {
|
||||||
|
|||||||
@@ -22,7 +22,8 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { nextTick, onMounted, ref } from 'vue'
|
import { nextTick, onMounted, ref } from 'vue'
|
||||||
|
|
||||||
import { electronAPI, isElectron, isNativeWindow } from '@/utils/envUtil'
|
import { isDesktop } from '@/platform/distribution/types'
|
||||||
|
import { electronAPI, isNativeWindow } from '@/utils/envUtil'
|
||||||
|
|
||||||
const { dark = false } = defineProps<{
|
const { dark = false } = defineProps<{
|
||||||
dark?: boolean
|
dark?: boolean
|
||||||
@@ -40,7 +41,7 @@ const lightTheme = {
|
|||||||
|
|
||||||
const topMenuRef = ref<HTMLDivElement | null>(null)
|
const topMenuRef = ref<HTMLDivElement | null>(null)
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
if (isElectron()) {
|
if (isDesktop) {
|
||||||
await nextTick()
|
await nextTick()
|
||||||
|
|
||||||
electronAPI().changeTheme({
|
electronAPI().changeTheme({
|
||||||
|
|||||||
@@ -7,6 +7,10 @@ import { createI18n } from 'vue-i18n'
|
|||||||
|
|
||||||
import BaseTerminal from '@/components/bottomPanel/tabs/terminal/BaseTerminal.vue'
|
import BaseTerminal from '@/components/bottomPanel/tabs/terminal/BaseTerminal.vue'
|
||||||
|
|
||||||
|
const distributionMock = {
|
||||||
|
isDesktop: false
|
||||||
|
}
|
||||||
|
|
||||||
// Mock xterm and related modules
|
// Mock xterm and related modules
|
||||||
vi.mock('@xterm/xterm', () => ({
|
vi.mock('@xterm/xterm', () => ({
|
||||||
Terminal: vi.fn().mockImplementation(() => ({
|
Terminal: vi.fn().mockImplementation(() => ({
|
||||||
@@ -53,8 +57,8 @@ vi.mock('@/composables/bottomPanelTabs/useTerminal', () => ({
|
|||||||
}))
|
}))
|
||||||
}))
|
}))
|
||||||
|
|
||||||
|
vi.mock('@/platform/distribution/types', () => distributionMock)
|
||||||
vi.mock('@/utils/envUtil', () => ({
|
vi.mock('@/utils/envUtil', () => ({
|
||||||
isElectron: vi.fn(() => false),
|
|
||||||
electronAPI: vi.fn(() => null)
|
electronAPI: vi.fn(() => null)
|
||||||
}))
|
}))
|
||||||
|
|
||||||
@@ -103,6 +107,7 @@ describe('BaseTerminal', () => {
|
|||||||
|
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
vi.clearAllMocks()
|
vi.clearAllMocks()
|
||||||
|
distributionMock.isDesktop = false
|
||||||
})
|
})
|
||||||
|
|
||||||
afterEach(() => {
|
afterEach(() => {
|
||||||
|
|||||||
@@ -4,6 +4,10 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
|
|||||||
import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
|
import { useBottomPanelStore } from '@/stores/workspace/bottomPanelStore'
|
||||||
import type { BottomPanelExtension } from '@/types/extensionTypes'
|
import type { BottomPanelExtension } from '@/types/extensionTypes'
|
||||||
|
|
||||||
|
const distributionMock = {
|
||||||
|
isDesktop: false
|
||||||
|
}
|
||||||
|
|
||||||
// Mock dependencies
|
// Mock dependencies
|
||||||
vi.mock('@/composables/bottomPanelTabs/useShortcutsTab', () => ({
|
vi.mock('@/composables/bottomPanelTabs/useShortcutsTab', () => ({
|
||||||
useShortcutsTab: () => [
|
useShortcutsTab: () => [
|
||||||
@@ -47,13 +51,12 @@ vi.mock('@/stores/commandStore', () => ({
|
|||||||
})
|
})
|
||||||
}))
|
}))
|
||||||
|
|
||||||
vi.mock('@/utils/envUtil', () => ({
|
vi.mock('@/platform/distribution/types', () => distributionMock)
|
||||||
isElectron: () => false
|
|
||||||
}))
|
|
||||||
|
|
||||||
describe('useBottomPanelStore', () => {
|
describe('useBottomPanelStore', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
setActivePinia(createPinia())
|
setActivePinia(createPinia())
|
||||||
|
distributionMock.isDesktop = false
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should initialize with empty panels', () => {
|
it('should initialize with empty panels', () => {
|
||||||
|
|||||||
@@ -4,9 +4,12 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
|
|||||||
|
|
||||||
import { useReleaseStore } from '@/platform/updates/common/releaseStore'
|
import { useReleaseStore } from '@/platform/updates/common/releaseStore'
|
||||||
|
|
||||||
|
const distributionMock = {
|
||||||
|
isDesktop: true
|
||||||
|
}
|
||||||
|
|
||||||
// Mock the dependencies
|
// Mock the dependencies
|
||||||
vi.mock('semver')
|
vi.mock('semver')
|
||||||
vi.mock('@/utils/envUtil')
|
|
||||||
vi.mock('@/platform/updates/common/releaseService')
|
vi.mock('@/platform/updates/common/releaseService')
|
||||||
vi.mock('@/platform/settings/settingStore')
|
vi.mock('@/platform/settings/settingStore')
|
||||||
vi.mock('@/stores/systemStatsStore')
|
vi.mock('@/stores/systemStatsStore')
|
||||||
@@ -15,6 +18,7 @@ vi.mock('@vueuse/core', () => ({
|
|||||||
useStorage: vi.fn(() => ({ value: {} })),
|
useStorage: vi.fn(() => ({ value: {} })),
|
||||||
createSharedComposable: vi.fn((fn) => fn)
|
createSharedComposable: vi.fn((fn) => fn)
|
||||||
}))
|
}))
|
||||||
|
vi.mock('@/platform/distribution/types', () => distributionMock)
|
||||||
|
|
||||||
describe('useReleaseStore', () => {
|
describe('useReleaseStore', () => {
|
||||||
let store: ReturnType<typeof useReleaseStore>
|
let store: ReturnType<typeof useReleaseStore>
|
||||||
@@ -36,6 +40,7 @@ describe('useReleaseStore', () => {
|
|||||||
|
|
||||||
// Reset all mocks
|
// Reset all mocks
|
||||||
vi.clearAllMocks()
|
vi.clearAllMocks()
|
||||||
|
distributionMock.isDesktop = true
|
||||||
|
|
||||||
// Setup mock services
|
// Setup mock services
|
||||||
mockReleaseService = {
|
mockReleaseService = {
|
||||||
@@ -66,12 +71,10 @@ describe('useReleaseStore', () => {
|
|||||||
)
|
)
|
||||||
const { useSettingStore } = await import('@/platform/settings/settingStore')
|
const { useSettingStore } = await import('@/platform/settings/settingStore')
|
||||||
const { useSystemStatsStore } = await import('@/stores/systemStatsStore')
|
const { useSystemStatsStore } = await import('@/stores/systemStatsStore')
|
||||||
const { isElectron } = await import('@/utils/envUtil')
|
|
||||||
|
|
||||||
vi.mocked(useReleaseService).mockReturnValue(mockReleaseService)
|
vi.mocked(useReleaseService).mockReturnValue(mockReleaseService)
|
||||||
vi.mocked(useSettingStore).mockReturnValue(mockSettingStore)
|
vi.mocked(useSettingStore).mockReturnValue(mockSettingStore)
|
||||||
vi.mocked(useSystemStatsStore).mockReturnValue(mockSystemStatsStore)
|
vi.mocked(useSystemStatsStore).mockReturnValue(mockSystemStatsStore)
|
||||||
vi.mocked(isElectron).mockReturnValue(true)
|
|
||||||
|
|
||||||
// Default showVersionUpdates to true
|
// Default showVersionUpdates to true
|
||||||
mockSettingStore.get.mockImplementation((key: string) => {
|
mockSettingStore.get.mockImplementation((key: string) => {
|
||||||
@@ -561,20 +564,19 @@ describe('useReleaseStore', () => {
|
|||||||
})
|
})
|
||||||
})
|
})
|
||||||
|
|
||||||
describe('isElectron environment checks', () => {
|
describe('isDesktop environment checks', () => {
|
||||||
beforeEach(async () => {
|
beforeEach(() => {
|
||||||
// Set up a new version available
|
|
||||||
store.releases = [mockRelease]
|
store.releases = [mockRelease]
|
||||||
mockSettingStore.get.mockImplementation((key: string) => {
|
mockSettingStore.get.mockImplementation((key: string) => {
|
||||||
if (key === 'Comfy.Notification.ShowVersionUpdates') return true
|
if (key === 'Comfy.Notification.ShowVersionUpdates') return true
|
||||||
return null
|
return null
|
||||||
})
|
})
|
||||||
|
distributionMock.isDesktop = true
|
||||||
})
|
})
|
||||||
|
|
||||||
describe('when running in Electron (desktop)', () => {
|
describe('when running in Electron (desktop)', () => {
|
||||||
beforeEach(async () => {
|
beforeEach(() => {
|
||||||
const { isElectron } = await import('@/utils/envUtil')
|
distributionMock.isDesktop = true
|
||||||
vi.mocked(isElectron).mockReturnValue(true)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should show toast when conditions are met', () => {
|
it('should show toast when conditions are met', () => {
|
||||||
@@ -600,9 +602,8 @@ describe('useReleaseStore', () => {
|
|||||||
})
|
})
|
||||||
|
|
||||||
describe('when NOT running in Electron (web)', () => {
|
describe('when NOT running in Electron (web)', () => {
|
||||||
beforeEach(async () => {
|
beforeEach(() => {
|
||||||
const { isElectron } = await import('@/utils/envUtil')
|
distributionMock.isDesktop = false
|
||||||
vi.mocked(isElectron).mockReturnValue(false)
|
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should NOT show toast even when all other conditions are met', () => {
|
it('should NOT show toast even when all other conditions are met', () => {
|
||||||
|
|||||||
@@ -3,7 +3,10 @@ import { beforeEach, describe, expect, it, vi } from 'vitest'
|
|||||||
|
|
||||||
import { api } from '@/scripts/api'
|
import { api } from '@/scripts/api'
|
||||||
import { useSystemStatsStore } from '@/stores/systemStatsStore'
|
import { useSystemStatsStore } from '@/stores/systemStatsStore'
|
||||||
import { isElectron } from '@/utils/envUtil'
|
|
||||||
|
const distributionMock = {
|
||||||
|
isDesktop: false
|
||||||
|
}
|
||||||
|
|
||||||
// Mock the API
|
// Mock the API
|
||||||
vi.mock('@/scripts/api', () => ({
|
vi.mock('@/scripts/api', () => ({
|
||||||
@@ -12,10 +15,8 @@ vi.mock('@/scripts/api', () => ({
|
|||||||
}
|
}
|
||||||
}))
|
}))
|
||||||
|
|
||||||
// Mock the envUtil
|
// Mock distribution flags
|
||||||
vi.mock('@/utils/envUtil', () => ({
|
vi.mock('@/platform/distribution/types', () => distributionMock)
|
||||||
isElectron: vi.fn()
|
|
||||||
}))
|
|
||||||
|
|
||||||
describe('useSystemStatsStore', () => {
|
describe('useSystemStatsStore', () => {
|
||||||
let store: ReturnType<typeof useSystemStatsStore>
|
let store: ReturnType<typeof useSystemStatsStore>
|
||||||
@@ -23,6 +24,7 @@ describe('useSystemStatsStore', () => {
|
|||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
// Mock API to prevent automatic fetch on store creation
|
// Mock API to prevent automatic fetch on store creation
|
||||||
vi.mocked(api.getSystemStats).mockResolvedValue(null as any)
|
vi.mocked(api.getSystemStats).mockResolvedValue(null as any)
|
||||||
|
distributionMock.isDesktop = false
|
||||||
setActivePinia(createPinia())
|
setActivePinia(createPinia())
|
||||||
store = useSystemStatsStore()
|
store = useSystemStatsStore()
|
||||||
vi.clearAllMocks()
|
vi.clearAllMocks()
|
||||||
@@ -159,7 +161,7 @@ describe('useSystemStatsStore', () => {
|
|||||||
|
|
||||||
describe('desktop environment (Electron)', () => {
|
describe('desktop environment (Electron)', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
vi.mocked(isElectron).mockReturnValue(true)
|
distributionMock.isDesktop = true
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should return "desktop-windows" for Windows desktop', () => {
|
it('should return "desktop-windows" for Windows desktop', () => {
|
||||||
@@ -237,7 +239,7 @@ describe('useSystemStatsStore', () => {
|
|||||||
|
|
||||||
describe('git environment (non-Electron)', () => {
|
describe('git environment (non-Electron)', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
vi.mocked(isElectron).mockReturnValue(false)
|
distributionMock.isDesktop = false
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should return "git-windows" for Windows git', () => {
|
it('should return "git-windows" for Windows git', () => {
|
||||||
@@ -315,7 +317,7 @@ describe('useSystemStatsStore', () => {
|
|||||||
|
|
||||||
describe('case insensitive OS detection', () => {
|
describe('case insensitive OS detection', () => {
|
||||||
beforeEach(() => {
|
beforeEach(() => {
|
||||||
vi.mocked(isElectron).mockReturnValue(false)
|
distributionMock.isDesktop = false
|
||||||
})
|
})
|
||||||
|
|
||||||
it('should handle uppercase OS names', () => {
|
it('should handle uppercase OS names', () => {
|
||||||
|
|||||||
Reference in New Issue
Block a user