mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-04-20 14:30:41 +00:00
82fb8ce658
## Summary Adds tests that simulate the execution flow and output feed ## Changes - **What**: - Add ExecutionHelper for mocking network activity - Refactor ws fixture to use Playwright websocket helper instead of patching window - ## Review Focus <!-- Critical design decisions or edge cases that need attention --> <!-- If this PR fixes an issue, uncomment and update the line below --> <!-- Fixes #ISSUE_NUMBER --> ## Screenshots (if applicable) <!-- Add screenshots or video recording to help explain your changes --> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-10801-test-App-mode-Execution-tests-3356d73d365081e4acf0c34378600031) by [Unito](https://www.unito.io)
71 lines
1.9 KiB
Vue
71 lines
1.9 KiB
Vue
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import type { Locale } from '../i18n/translations'
|
|
import { t } from '../i18n/translations'
|
|
|
|
const { locale = 'en' } = defineProps<{ locale?: Locale }>()
|
|
|
|
const pillars = computed(() => [
|
|
{
|
|
icon: '⚡',
|
|
title: t('pillars.buildTitle', locale),
|
|
description: t('pillars.buildDesc', locale)
|
|
},
|
|
{
|
|
icon: '🎨',
|
|
title: t('pillars.customizeTitle', locale),
|
|
description: t('pillars.customizeDesc', locale)
|
|
},
|
|
{
|
|
icon: '🔧',
|
|
title: t('pillars.refineTitle', locale),
|
|
description: t('pillars.refineDesc', locale)
|
|
},
|
|
{
|
|
icon: '⚙️',
|
|
title: t('pillars.automateTitle', locale),
|
|
description: t('pillars.automateDesc', locale)
|
|
},
|
|
{
|
|
icon: '🚀',
|
|
title: t('pillars.runTitle', locale),
|
|
description: t('pillars.runDesc', locale)
|
|
}
|
|
])
|
|
</script>
|
|
|
|
<template>
|
|
<section class="bg-black px-6 py-24">
|
|
<div class="mx-auto max-w-7xl">
|
|
<header class="mb-16 text-center">
|
|
<h2 class="text-3xl font-bold text-white md:text-4xl">
|
|
{{ t('pillars.heading', locale) }}
|
|
</h2>
|
|
<p class="mt-4 text-smoke-700">
|
|
{{ t('pillars.subheading', locale) }}
|
|
</p>
|
|
</header>
|
|
|
|
<div class="grid grid-cols-1 gap-6 sm:grid-cols-2 lg:grid-cols-5">
|
|
<article
|
|
v-for="pillar in pillars"
|
|
:key="pillar.title"
|
|
class="rounded-xl border border-white/10 bg-charcoal-600 p-6 transition-colors hover:border-brand-yellow"
|
|
>
|
|
<div
|
|
class="flex size-12 items-center justify-center rounded-full bg-brand-yellow text-xl"
|
|
>
|
|
{{ pillar.icon }}
|
|
</div>
|
|
<h3 class="mt-4 text-lg font-semibold text-white">
|
|
{{ pillar.title }}
|
|
</h3>
|
|
<p class="mt-2 text-sm text-smoke-700">
|
|
{{ pillar.description }}
|
|
</p>
|
|
</article>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</template>
|