DEV: Update lint-configs and autofix issues (#31620)

This updates us to Prettier 3.x
This commit is contained in:
Jarek Radosz 2025-03-05 01:20:16 +01:00 committed by GitHub
parent f8b30ffd06
commit 28e00d9bfe
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
154 changed files with 3651 additions and 2922 deletions

View File

@ -20,6 +20,7 @@ plugins/**/lib/javascripts/locale
public/
!/app/assets/javascripts/discourse/public
vendor/
app/assets/javascripts/discourse/tests/unit/utils/decorators-test.js
app/assets/javascripts/discourse/tests/fixtures
spec/
node_modules/

View File

@ -5,13 +5,13 @@ import { i18n } from "discourse-i18n";
export default class ScreenedEmail extends EmberObject {
static findAll() {
return ajax("/admin/logs/screened_emails.json").then(function (
screened_emails
) {
return screened_emails.map(function (b) {
return ScreenedEmail.create(b);
});
});
return ajax("/admin/logs/screened_emails.json").then(
function (screened_emails) {
return screened_emails.map(function (b) {
return ScreenedEmail.create(b);
});
}
);
}
@discourseComputed("action")

View File

@ -5,13 +5,13 @@ import { i18n } from "discourse-i18n";
export default class ScreenedUrl extends EmberObject {
static findAll() {
return ajax("/admin/logs/screened_urls.json").then(function (
screened_urls
) {
return screened_urls.map(function (b) {
return ScreenedUrl.create(b);
});
});
return ajax("/admin/logs/screened_urls.json").then(
function (screened_urls) {
return screened_urls.map(function (b) {
return ScreenedUrl.create(b);
});
}
);
}
@discourseComputed("action")

View File

@ -7,26 +7,26 @@ import SettingObjectHelper from "admin/lib/setting-object-helper";
export default class SiteSetting extends EmberObject {
static findAll(params = {}) {
return ajax("/admin/site_settings", { data: params }).then(function (
settings
) {
// Group the results by category
const categories = {};
settings.site_settings.forEach(function (s) {
if (!categories[s.category]) {
categories[s.category] = [];
}
categories[s.category].pushObject(SiteSetting.create(s));
});
return ajax("/admin/site_settings", { data: params }).then(
function (settings) {
// Group the results by category
const categories = {};
settings.site_settings.forEach(function (s) {
if (!categories[s.category]) {
categories[s.category] = [];
}
categories[s.category].pushObject(SiteSetting.create(s));
});
return Object.keys(categories).map(function (n) {
return {
nameKey: n,
name: i18n("admin.site_settings.categories." + n),
siteSettings: categories[n],
};
});
});
return Object.keys(categories).map(function (n) {
return {
nameKey: n,
name: i18n("admin.site_settings.categories." + n),
siteSettings: categories[n],
};
});
}
);
}
static update(key, value, opts = {}) {

View File

@ -4,30 +4,32 @@ import DPageHeader from "discourse/components/d-page-header";
import PluginOutlet from "discourse/components/plugin-outlet";
import { i18n } from "discourse-i18n";
export default RouteTemplate(<template>
<PluginOutlet @name="admin-api-keys">
<DPageHeader
@titleLabel={{i18n "admin.config.api_keys.title"}}
@descriptionLabel={{i18n "admin.config.api_keys.header_description"}}
@hideTabs={{true}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/api/keys"
@label={{i18n "admin.config.api_keys.title"}}
/>
</:breadcrumbs>
<:actions as |actions|>
<actions.Primary
@route="adminApiKeys.new"
@label="admin.api_keys.add"
/>
</:actions>
</DPageHeader>
export default RouteTemplate(
<template>
<PluginOutlet @name="admin-api-keys">
<DPageHeader
@titleLabel={{i18n "admin.config.api_keys.title"}}
@descriptionLabel={{i18n "admin.config.api_keys.header_description"}}
@hideTabs={{true}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/api/keys"
@label={{i18n "admin.config.api_keys.title"}}
/>
</:breadcrumbs>
<:actions as |actions|>
<actions.Primary
@route="adminApiKeys.new"
@label="admin.api_keys.add"
/>
</:actions>
</DPageHeader>
<div class="admin-container admin-config-page__main-area">
{{outlet}}
</div>
</PluginOutlet>
</template>);
<div class="admin-container admin-config-page__main-area">
{{outlet}}
</div>
</PluginOutlet>
</template>
);

View File

@ -5,32 +5,34 @@ import { i18n } from "discourse-i18n";
import AdminBrandingLogoForm from "admin/components/admin-branding-logo-form";
import AdminConfigAreaCard from "admin/components/admin-config-area-card";
export default RouteTemplate(<template>
<div class="admin-config-page">
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.branding.title"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/branding"
@label={{i18n "admin.config.branding.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-area">
<div class="admin-config-area__primary-content">
<AdminConfigAreaCard
@heading="admin.config.branding.logo.title"
@collapsable={{true}}
class="admin-config-area-branding__logo"
>
<:content>
<AdminBrandingLogoForm />
</:content>
</AdminConfigAreaCard>
export default RouteTemplate(
<template>
<div class="admin-config-page">
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.branding.title"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/branding"
@label={{i18n "admin.config.branding.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-area">
<div class="admin-config-area__primary-content">
<AdminConfigAreaCard
@heading="admin.config.branding.logo.title"
@collapsable={{true}}
class="admin-config-area-branding__logo"
>
<:content>
<AdminBrandingLogoForm />
</:content>
</AdminConfigAreaCard>
</div>
</div>
</div>
</div>
</template>);
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.developer.title"}}
@descriptionLabel={{i18n "admin.config.developer.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/developer"
@label={{i18n "admin.config.developer.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.developer.title"}}
@descriptionLabel={{i18n "admin.config.developer.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/developer"
@label={{i18n "admin.config.developer.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="developer"
@path="/admin/config/developer"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="developer"
@path="/admin/config/developer"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.experimental.title"}}
@descriptionLabel={{i18n "admin.config.experimental.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/experimental"
@label={{i18n "admin.config.experimental.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.experimental.title"}}
@descriptionLabel={{i18n "admin.config.experimental.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/experimental"
@label={{i18n "admin.config.experimental.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="experimental"
@path="/admin/config/experimental"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="experimental"
@path="/admin/config/experimental"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.files.title"}}
@descriptionLabel={{i18n "admin.config.files.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/files"
@label={{i18n "admin.config.files.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.files.title"}}
@descriptionLabel={{i18n "admin.config.files.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/files"
@label={{i18n "admin.config.files.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="files"
@path="/admin/config/files"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="files"
@path="/admin/config/files"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.font_style.title"}}
@descriptionLabel={{i18n "admin.config.font_style.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/fonts"
@label={{i18n "admin.config.font_style.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.font_style.title"}}
@descriptionLabel={{i18n "admin.config.font_style.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/fonts"
@label={{i18n "admin.config.font_style.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="fonts"
@path="/admin/config/fonts"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="fonts"
@path="/admin/config/fonts"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,30 +4,32 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.group_permissions.title"}}
@descriptionLabel={{i18n
"admin.config.group_permissions.header_description"
}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/group-permissions"
@label={{i18n "admin.config.group_permissions.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.group_permissions.title"}}
@descriptionLabel={{i18n
"admin.config.group_permissions.header_description"
}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/group-permissions"
@label={{i18n "admin.config.group_permissions.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="group_permissions"
@path="/admin/config/group-permissions"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="group_permissions"
@path="/admin/config/group-permissions"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.legal.title"}}
@descriptionLabel={{i18n "admin.config.legal.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/legal"
@label={{i18n "admin.config.legal.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.legal.title"}}
@descriptionLabel={{i18n "admin.config.legal.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/legal"
@label={{i18n "admin.config.legal.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="legal"
@path="/admin/config/legal"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="legal"
@path="/admin/config/legal"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.localization.title"}}
@descriptionLabel={{i18n "admin.config.localization.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/localization"
@label={{i18n "admin.config.localization.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.localization.title"}}
@descriptionLabel={{i18n "admin.config.localization.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/localization"
@label={{i18n "admin.config.localization.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="localization"
@path="/admin/config/localization"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="localization"
@path="/admin/config/localization"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,30 +4,32 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.login_and_authentication.title"}}
@descriptionLabel={{i18n
"admin.config.login_and_authentication.header_description"
}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/login-and-authentication"
@label={{i18n "admin.config.login_and_authentication.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.login_and_authentication.title"}}
@descriptionLabel={{i18n
"admin.config.login_and_authentication.header_description"
}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/login-and-authentication"
@label={{i18n "admin.config.login_and_authentication.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="login"
@path="/admin/config/login-and-authentication"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="login"
@path="/admin/config/login-and-authentication"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -5,28 +5,30 @@ import { i18n } from "discourse-i18n";
import AdminBrandingLogoForm from "admin/components/admin-branding-logo-form";
import AdminConfigAreaCard from "admin/components/admin-config-area-card";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.logo.title"}}
@descriptionLabel={{i18n "admin.config.logo.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/logo"
@label={{i18n "admin.config.logo.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.logo.title"}}
@descriptionLabel={{i18n "admin.config.logo.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/logo"
@label={{i18n "admin.config.logo.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<AdminConfigAreaCard
@heading="admin.config.branding.logo.title"
@collapsable={{true}}
class="admin-config-area-branding__logo"
>
<:content>
<AdminBrandingLogoForm />
</:content>
</AdminConfigAreaCard>
</template>);
<AdminConfigAreaCard
@heading="admin.config.branding.logo.title"
@collapsable={{true}}
class="admin-config-area-branding__logo"
>
<:content>
<AdminBrandingLogoForm />
</:content>
</AdminConfigAreaCard>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.navigation.title"}}
@descriptionLabel={{i18n "admin.config.navigation.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/navigation"
@label={{i18n "admin.config.navigation.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.navigation.title"}}
@descriptionLabel={{i18n "admin.config.navigation.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/navigation"
@label={{i18n "admin.config.navigation.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="navigation"
@path="/admin/config/navigation"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="navigation"
@path="/admin/config/navigation"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.notifications.title"}}
@descriptionLabel={{i18n "admin.config.notifications.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/notifications"
@label={{i18n "admin.config.notifications.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.notifications.title"}}
@descriptionLabel={{i18n "admin.config.notifications.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/notifications"
@label={{i18n "admin.config.notifications.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="notifications"
@path="/admin/config/notifications"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="notifications"
@path="/admin/config/notifications"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.onebox.title"}}
@descriptionLabel={{i18n "admin.config.onebox.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/onebox"
@label={{i18n "admin.config.onebox.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.onebox.title"}}
@descriptionLabel={{i18n "admin.config.onebox.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/onebox"
@label={{i18n "admin.config.onebox.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="onebox"
@path="/admin/config/onebox"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="onebox"
@path="/admin/config/onebox"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.other.title"}}
@descriptionLabel={{i18n "admin.config.other.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/other"
@label={{i18n "admin.config.other.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.other.title"}}
@descriptionLabel={{i18n "admin.config.other.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/other"
@label={{i18n "admin.config.other.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="uncategorized"
@path="/admin/config/other"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="uncategorized"
@path="/admin/config/other"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.rate_limits.title"}}
@descriptionLabel={{i18n "admin.config.rate_limits.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/rate-limits"
@label={{i18n "admin.config.rate_limits.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.rate_limits.title"}}
@descriptionLabel={{i18n "admin.config.rate_limits.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/rate-limits"
@label={{i18n "admin.config.rate_limits.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="rate_limits"
@path="/admin/config/rate-limits"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="rate_limits"
@path="/admin/config/rate-limits"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.search.title"}}
@descriptionLabel={{i18n "admin.config.search.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/search"
@label={{i18n "admin.config.search.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.search.title"}}
@descriptionLabel={{i18n "admin.config.search.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/search"
@label={{i18n "admin.config.search.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="search"
@path="/admin/config/search"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="search"
@path="/admin/config/search"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.security.title"}}
@descriptionLabel={{i18n "admin.config.security.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/security"
@label={{i18n "admin.config.security.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.security.title"}}
@descriptionLabel={{i18n "admin.config.security.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/security"
@label={{i18n "admin.config.security.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="security"
@path="/admin/config/security"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="security"
@path="/admin/config/security"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.spam.title"}}
@descriptionLabel={{i18n "admin.config.spam.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/spam"
@label={{i18n "admin.config.spam.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.spam.title"}}
@descriptionLabel={{i18n "admin.config.spam.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/spam"
@label={{i18n "admin.config.spam.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="spam"
@path="/admin/config/spam"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="spam"
@path="/admin/config/spam"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,29 +4,31 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.trust_levels.title"}}
@descriptionLabel={{i18n "admin.config.trust_levels.header_description"}}
@learnMoreUrl="https://blog.discourse.org/2018/06/understanding-discourse-trust-levels/"
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/trust-levels"
@label={{i18n "admin.config.trust_levels.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.trust_levels.title"}}
@descriptionLabel={{i18n "admin.config.trust_levels.header_description"}}
@learnMoreUrl="https://blog.discourse.org/2018/06/understanding-discourse-trust-levels/"
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/trust-levels"
@label={{i18n "admin.config.trust_levels.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="trust_levels"
@path="/admin/config/trust-levels"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@area="trust_levels"
@path="/admin/config/trust-levels"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,28 +4,30 @@ import DPageHeader from "discourse/components/d-page-header";
import { i18n } from "discourse-i18n";
import AdminAreaSettings from "admin/components/admin-area-settings";
export default RouteTemplate(<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.user_api.title"}}
@descriptionLabel={{i18n "admin.config.user_api.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/user-api"
@label={{i18n "admin.config.user_api.title"}}
/>
</:breadcrumbs>
</DPageHeader>
export default RouteTemplate(
<template>
<DPageHeader
@hideTabs={{true}}
@titleLabel={{i18n "admin.config.user_api.title"}}
@descriptionLabel={{i18n "admin.config.user_api.header_description"}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/config/user-api"
@label={{i18n "admin.config.user_api.title"}}
/>
</:breadcrumbs>
</DPageHeader>
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="user_api"
@path="/admin/config/user-api"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>);
<div class="admin-config-page__main-area">
<AdminAreaSettings
@showBreadcrumb={{false}}
@categories="user_api"
@path="/admin/config/user-api"
@filter={{@controller.filter}}
@adminSettingsFilterChangedCallback={{@controller.adminSettingsFilterChangedCallback}}
/>
</div>
</template>
);

View File

@ -4,32 +4,34 @@ import DPageHeader from "discourse/components/d-page-header";
import PluginOutlet from "discourse/components/plugin-outlet";
import { i18n } from "discourse-i18n";
export default RouteTemplate(<template>
<div class="admin-webhooks admin-config-page">
<DPageHeader
@titleLabel={{i18n "admin.config.webhooks.title"}}
@descriptionLabel={{i18n "admin.config.webhooks.header_description"}}
@hideTabs={{true}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/api/web_hooks"
@label={{i18n "admin.config.webhooks.title"}}
/>
</:breadcrumbs>
<:actions as |actions|>
<actions.Primary
@route="adminWebHooks.new"
@label="admin.web_hooks.add"
/>
</:actions>
</DPageHeader>
export default RouteTemplate(
<template>
<div class="admin-webhooks admin-config-page">
<DPageHeader
@titleLabel={{i18n "admin.config.webhooks.title"}}
@descriptionLabel={{i18n "admin.config.webhooks.header_description"}}
@hideTabs={{true}}
>
<:breadcrumbs>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/admin/api/web_hooks"
@label={{i18n "admin.config.webhooks.title"}}
/>
</:breadcrumbs>
<:actions as |actions|>
<actions.Primary
@route="adminWebHooks.new"
@label="admin.web_hooks.add"
/>
</:actions>
</DPageHeader>
<div class="admin-container admin-config-page__main-area">
<PluginOutlet @name="admin-web-hooks">
{{outlet}}
</PluginOutlet>
<div class="admin-container admin-config-page__main-area">
<PluginOutlet @name="admin-web-hooks">
{{outlet}}
</PluginOutlet>
</div>
</div>
</div>
</template>);
</template>
);

View File

@ -156,9 +156,8 @@ export default class ComposerMessages extends Component {
let usernames = [];
response.usernames.forEach((username, index) => {
usernames[
index
] = `<a class='mention' href='/u/${username}'>@${username}</a>`;
usernames[index] =
`<a class='mention' href='/u/${username}'>@${username}</a>`;
});
let body_key;

View File

@ -21,8 +21,8 @@ export default class ComposerToggles extends Component {
return composeState === "draft"
? "composer.open"
: composeState === "fullscreen"
? "composer.exit_fullscreen"
: "composer.enter_fullscreen";
? "composer.exit_fullscreen"
: "composer.enter_fullscreen";
}
@discourseComputed("composeState")
@ -37,8 +37,8 @@ export default class ComposerToggles extends Component {
return composeState === "draft"
? "angles-up"
: composeState === "fullscreen"
? "discourse-compress"
: "discourse-expand";
? "discourse-compress"
: "discourse-expand";
}
@discourseComputed("disableTextarea")

View File

@ -30,8 +30,8 @@ export default class DateTimeInput extends Component {
const date = this.date
? this.date
: this.relativeDate
? this.relativeDate
: moment.tz(this.resolvedTimezone);
? this.relativeDate
: moment.tz(this.resolvedTimezone);
this.onChange(
moment.tz(

View File

@ -30,8 +30,8 @@ export default class GroupSelector extends Component {
items: Array.isArray(groupNames)
? groupNames
: isEmpty(groupNames)
? []
: [groupNames],
? []
: [groupNames],
single: this.single,
fullWidthWrap: this.fullWidthWrap,
updateData: opts && opts.updateData ? opts.updateData : false,

View File

@ -70,7 +70,7 @@ export default class Notifications extends Component {
{{#if this.currentUser.status}}
<UserStatusBubble
@timezone={{this.this.currentUser.user_option.timezone}}
@timezone={{this.currentUser.user_option.timezone}}
@status={{this.currentUser.status}}
/>
{{/if}}

View File

@ -6,7 +6,9 @@
>
<:body>
<pre>
<code class={{@model.codeClasses}}>{{@model.code}}</code>
<code
class={{@model.codeClasses}}
>{{@model.code}}</code>
</pre>
</:body>
</DModal>

View File

@ -82,9 +82,8 @@ export default class UserPasskeys extends Component {
name: i18n("user.passkeys.name.default"),
};
const registrationResponse = await this.args.model.registerPasskey(
credentialParam
);
const registrationResponse =
await this.args.model.registerPasskey(credentialParam);
if (registrationResponse.error) {
this.dialog.alert(registrationResponse.error);

View File

@ -52,8 +52,8 @@ export default class FKControlInput extends Component {
event.target.value === ""
? undefined
: this.type === "number"
? parseFloat(event.target.value)
: event.target.value;
? parseFloat(event.target.value)
: event.target.value;
this.args.field.set(value);
}

View File

@ -260,7 +260,5 @@ export default class FKFieldData extends Component {
});
}
<template>
{{yield this}}
</template>
<template>{{yield this}}</template>
}

View File

@ -4,12 +4,24 @@ const empty = <template>
{{! template-lint-disable no-yield-only}}{{yield}}
</template>;
const shortcuts = {
div: <template><div ...attributes>{{yield}}</div></template>,
span: <template><span ...attributes>{{yield}}</span></template>,
form: <template><form ...attributes>{{yield}}</form></template>,
a: <template><a ...attributes>{{yield}}</a></template>,
button: <template><button ...attributes>{{yield}}</button></template>,
td: <template><td ...attributes>{{yield}}</td></template>,
div: <template>
<div ...attributes>{{yield}}</div>
</template>,
span: <template>
<span ...attributes>{{yield}}</span>
</template>,
form: <template>
<form ...attributes>{{yield}}</form>
</template>,
a: <template>
<a ...attributes>{{yield}}</a>
</template>,
button: <template>
<button ...attributes>{{yield}}</button>
</template>,
td: <template>
<td ...attributes>{{yield}}</td>
</template>,
};
/**

View File

@ -23,10 +23,10 @@ function addonFmt(str, formats) {
return typeof s === "string"
? s
: s === null
? "(null)"
: s === undefined
? ""
: "" + s;
? "(null)"
: s === undefined
? ""
: "" + s;
});
}
/**

View File

@ -264,8 +264,8 @@ function uploadTypeFromFileName(fileName) {
return isImage(fileName)
? "image"
: isBackup(fileName)
? "backup"
: "attachment";
? "backup"
: "attachment";
}
export function allowsImages(staff, siteSettings) {

View File

@ -70,7 +70,8 @@
}
.fw {
font-family: "Courier New", "Courier", "Lucida Console", "Monaco", monospace;
font-family:
"Courier New", "Courier", "Lucida Console", "Monaco", monospace;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;

View File

@ -3,12 +3,14 @@ import hideApplicationFooter from "discourse/helpers/hide-application-footer";
import hideApplicationSidebar from "discourse/helpers/hide-application-sidebar";
import DiscourseLogo from "discourse/static/wizard/components/discourse-logo";
export default RouteTemplate(<template>
{{hideApplicationSidebar}}
{{hideApplicationFooter}}
<div id="wizard-main">
<DiscourseLogo />
export default RouteTemplate(
<template>
{{hideApplicationSidebar}}
{{hideApplicationFooter}}
<div id="wizard-main">
<DiscourseLogo />
{{outlet}}
</div>
</template>);
{{outlet}}
</div>
</template>
);

View File

@ -108,10 +108,10 @@ export const WidgetDropdownItemClass = {
attrs.item === "separator"
? "<hr>"
: attrs.item.html
? attrs.item.html
: attrs.item.translatedLabel
? attrs.item.translatedLabel
: i18n(attrs.item.label),
? attrs.item.html
: attrs.item.translatedLabel
? attrs.item.translatedLabel
: i18n(attrs.item.label),
};
},

View File

@ -10,9 +10,12 @@ import { acceptance } from "discourse/tests/helpers/qunit-helpers";
acceptance("Header API - anonymous", function () {
test("can add buttons to the header", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerButtons.add("test", <template>
<button class="test-button">Test</button>
</template>);
api.headerButtons.add(
"test",
<template>
<button class="test-button">Test</button>
</template>
);
});
await visit("/");
@ -21,9 +24,12 @@ acceptance("Header API - anonymous", function () {
test("buttons are positioned to the left of the auth buttons by default", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerButtons.add("test", <template>
<button class="test-button">Test</button>
</template>);
api.headerButtons.add(
"test",
<template>
<button class="test-button">Test</button>
</template>
);
});
await visit("/");
@ -38,9 +44,12 @@ acceptance("Header API - anonymous", function () {
test("can add icons to the header", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerIcons.add("test", <template>
<span class="test-icon">Test</span>
</template>);
api.headerIcons.add(
"test",
<template>
<span class="test-icon">Test</span>
</template>
);
});
await visit("/");
@ -49,9 +58,12 @@ acceptance("Header API - anonymous", function () {
test("icons are positioned to the left of search icon by default", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerIcons.add("test", <template>
<span class="test-icon">Test</span>
</template>);
api.headerIcons.add(
"test",
<template>
<span class="test-icon">Test</span>
</template>
);
});
await visit("/");
@ -70,9 +82,12 @@ acceptance("Glimmer Header API - authenticated", function (needs) {
test("can add buttons to the header", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerButtons.add("test", <template>
<button class="test-button">Test</button>
</template>);
api.headerButtons.add(
"test",
<template>
<button class="test-button">Test</button>
</template>
);
});
await visit("/");
@ -81,13 +96,18 @@ acceptance("Glimmer Header API - authenticated", function (needs) {
test("buttons can be repositioned", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerButtons.add("test1", <template>
<button class="test1-button">Test1</button>
</template>);
api.headerButtons.add(
"test1",
<template>
<button class="test1-button">Test1</button>
</template>
);
api.headerButtons.add(
"test2",
<template><button class="test2-button">Test2</button></template>,
<template>
<button class="test2-button">Test2</button>
</template>,
{ before: "test1" }
);
});
@ -104,9 +124,12 @@ acceptance("Glimmer Header API - authenticated", function (needs) {
test("can add icons to the header", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerIcons.add("test", <template>
<span class="test-icon">Test</span>
</template>);
api.headerIcons.add(
"test",
<template>
<span class="test-icon">Test</span>
</template>
);
});
await visit("/");
@ -115,13 +138,18 @@ acceptance("Glimmer Header API - authenticated", function (needs) {
test("icons can be repositioned", async function (assert) {
withPluginApi("1.29.0", (api) => {
api.headerIcons.add("test1", <template>
<span class="test1-icon">Test1</span>
</template>);
api.headerIcons.add(
"test1",
<template>
<span class="test1-icon">Test1</span>
</template>
);
api.headerIcons.add(
"test2",
<template><span class="test2-icon">Test2</span></template>,
<template>
<span class="test2-icon">Test2</span>
</template>,
{ before: "test1" }
);
});

View File

@ -11,9 +11,8 @@ acceptance("Plugin Keyboard Shortcuts - Logged In", function (needs) {
test("a plugin can add a keyboard shortcut", async function (assert) {
withPluginApi("0.8.38", (api) => {
api.addKeyboardShortcut("]", () => {
document.querySelector(
"#qunit-fixture"
).innerHTML = `<div id="added-element">Test adding plugin shortcut</div>`;
document.querySelector("#qunit-fixture").innerHTML =
`<div id="added-element">Test adding plugin shortcut</div>`;
});
});

View File

@ -16,13 +16,15 @@ export async function testMarkdown(
self.view = textManipulation.view;
};
await render(<template>
<DEditor
@value={{self.value}}
@processPreview={{false}}
@onSetup={{handleSetup}}
/>
</template>);
await render(
<template>
<DEditor
@value={{self.value}}
@processPreview={{false}}
@onSetup={{handleSetup}}
/>
</template>
);
await click(".composer-toggle-switch");
await waitFor(".ProseMirror");

View File

@ -7,65 +7,77 @@ module("Integration | Component | ace-editor", function (hooks) {
setupRenderingTest(hooks);
test("css editor", async function (assert) {
await render(<template>
<AceEditor @mode="css" style="width: 300px; height: 200px" />
</template>);
await render(
<template>
<AceEditor @mode="css" style="width: 300px; height: 200px" />
</template>
);
assert.dom(".ace_editor").exists("it renders the ace editor");
});
test("html editor", async function (assert) {
await render(<template>
<AceEditor
@mode="html"
@content="<b>wat</b>"
style="width: 300px; height: 200px"
/>
</template>);
await render(
<template>
<AceEditor
@mode="html"
@content="<b>wat</b>"
style="width: 300px; height: 200px"
/>
</template>
);
assert.dom(".ace_editor").exists("it renders the ace editor");
});
test("sql editor", async function (assert) {
await render(<template>
<AceEditor
@mode="sql"
@content="SELECT * FROM users"
style="width: 300px; height: 200px"
/>
</template>);
await render(
<template>
<AceEditor
@mode="sql"
@content="SELECT * FROM users"
style="width: 300px; height: 200px"
/>
</template>
);
assert.dom(".ace_editor").exists("it renders the ace editor");
});
test("yaml editor", async function (assert) {
await render(<template>
<AceEditor
@mode="yaml"
@content="test: true"
style="width: 300px; height: 200px"
/>
</template>);
await render(
<template>
<AceEditor
@mode="yaml"
@content="test: true"
style="width: 300px; height: 200px"
/>
</template>
);
assert.dom(".ace_editor").exists("it renders the ace editor");
});
test("javascript editor", async function (assert) {
await render(<template>
<AceEditor
@mode="javascript"
@content="test: true"
style="width: 300px; height: 200px"
/>
</template>);
await render(
<template>
<AceEditor
@mode="javascript"
@content="test: true"
style="width: 300px; height: 200px"
/>
</template>
);
assert.dom(".ace_editor").exists("it renders the ace editor");
});
test("disabled editor", async function (assert) {
await render(<template>
<AceEditor
@mode="sql"
@content="SELECT * FROM users"
@disabled={{true}}
style="width: 300px; height: 200px"
/>
</template>);
await render(
<template>
<AceEditor
@mode="sql"
@content="SELECT * FROM users"
@disabled={{true}}
style="width: 300px; height: 200px"
/>
</template>
);
assert.dom(".ace_editor").exists("it renders the ace editor");
assert

View File

@ -66,13 +66,15 @@ module("Integration | Component | AdminAreaSettings", function (hooks) {
test("renders area settings and allows to filter", async function (assert) {
const callback = () => {};
await render(<template>
<AdminAreaSettings
@area="flags"
@adminSettingsFilterChangedCallback={{callback}}
@filter=""
/>
</template>);
await render(
<template>
<AdminAreaSettings
@area="flags"
@adminSettingsFilterChangedCallback={{callback}}
@filter=""
/>
</template>
);
assert.dom(".admin-site-settings-filter-controls").exists();
assert.dom(".setting-label").exists({ count: 2 });

View File

@ -9,10 +9,12 @@ module(
setupRenderingTest(hooks);
test("renders admin config area card section without toggle button", async function (assert) {
await render(<template>
<AdminConfigAreaCardSection @heading="test heading"><:content
>test</:content></AdminConfigAreaCardSection>
</template>);
await render(
<template>
<AdminConfigAreaCardSection @heading="test heading"><:content
>test</:content></AdminConfigAreaCardSection>
</template>
);
assert
.dom(".admin-config-area-card-section__title")
@ -24,12 +26,14 @@ module(
});
test("renders admin config area card section with toggle button", async function (assert) {
await render(<template>
<AdminConfigAreaCardSection
@heading="test heading"
@collapsable={{true}}
><:content>test</:content></AdminConfigAreaCardSection>
</template>);
await render(
<template>
<AdminConfigAreaCardSection
@heading="test heading"
@collapsable={{true}}
><:content>test</:content></AdminConfigAreaCardSection>
</template>
);
assert
.dom(".admin-config-area-card-section__title")
@ -45,13 +49,15 @@ module(
});
test("renders admin config area card section with toggle button and collapsed by default", async function (assert) {
await render(<template>
<AdminConfigAreaCardSection
@heading="test heading"
@collapsable={{true}}
@collapsed={{true}}
><:content>test</:content></AdminConfigAreaCardSection>
</template>);
await render(
<template>
<AdminConfigAreaCardSection
@heading="test heading"
@collapsable={{true}}
@collapsed={{true}}
><:content>test</:content></AdminConfigAreaCardSection>
</template>
);
assert.dom(".admin-config-area-card-section__title").exists();
assert.dom(".admin-config-area-card-section__toggle-button").exists();

View File

@ -7,10 +7,12 @@ module("Integration | Component | AdminConfigAreaCard", function (hooks) {
setupRenderingTest(hooks);
test("renders admin config area card without toggle button", async function (assert) {
await render(<template>
<AdminConfigAreaCard @translatedHeading="test heading"><:content
>test</:content></AdminConfigAreaCard>
</template>);
await render(
<template>
<AdminConfigAreaCard @translatedHeading="test heading"><:content
>test</:content></AdminConfigAreaCard>
</template>
);
assert.dom(".admin-config-area-card__title").exists();
assert.dom(".admin-config-area-card__content").exists();
@ -18,12 +20,14 @@ module("Integration | Component | AdminConfigAreaCard", function (hooks) {
});
test("renders admin config area card with toggle button", async function (assert) {
await render(<template>
<AdminConfigAreaCard
@translatedHeading="test heading"
@collapsable={{true}}
><:content>test</:content></AdminConfigAreaCard>
</template>);
await render(
<template>
<AdminConfigAreaCard
@translatedHeading="test heading"
@collapsable={{true}}
><:content>test</:content></AdminConfigAreaCard>
</template>
);
assert.dom(".admin-config-area-card__title").exists();
assert.dom(".admin-config-area-card__content").exists();
@ -37,13 +41,15 @@ module("Integration | Component | AdminConfigAreaCard", function (hooks) {
});
test("renders admin config area card with toggle button and collapsed by default", async function (assert) {
await render(<template>
<AdminConfigAreaCard
@translatedHeading="test heading"
@collapsable={{true}}
@collapsed={{true}}
><:content>test</:content></AdminConfigAreaCard>
</template>);
await render(
<template>
<AdminConfigAreaCard
@translatedHeading="test heading"
@collapsable={{true}}
@collapsed={{true}}
><:content>test</:content></AdminConfigAreaCard>
</template>
);
assert.dom(".admin-config-area-card__title").exists();
assert.dom(".admin-config-area-card__toggle-button").exists();
@ -51,14 +57,16 @@ module("Integration | Component | AdminConfigAreaCard", function (hooks) {
});
test("renders admin config area card with header action", async function (assert) {
await render(<template>
<AdminConfigAreaCard
@translatedHeading="test heading"
@collapsable={{true}}
>
<:headerAction><button>test</button></:headerAction>
<:content>test</:content></AdminConfigAreaCard>
</template>);
await render(
<template>
<AdminConfigAreaCard
@translatedHeading="test heading"
@collapsable={{true}}
>
<:headerAction><button>test</button></:headerAction>
<:content>test</:content></AdminConfigAreaCard>
</template>
);
assert.dom(".admin-config-area-card__header-action button").exists();
});

View File

@ -89,9 +89,11 @@ module(
test("activates the first node by default", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -103,9 +105,11 @@ module(
test("renders the 2nd level of nested items for the active item only", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -146,9 +150,11 @@ module(
test("allows navigating through multiple levels of nesting", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -236,9 +242,11 @@ module(
test("the back button is only shown when the navigation is at least one level deep", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
assert.dom(".--back-btn").doesNotExist();
@ -271,9 +279,11 @@ module(
test("the back button navigates to the index of the active element at the previous level", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
await click(tree.nodes[1].element);
@ -298,9 +308,11 @@ module(
test("the back button label includes the name of the item at the previous level", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
await click(tree.nodes[1].element);
@ -358,9 +370,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -380,9 +394,11 @@ module(
test("input fields for items at different levels", async function (assert) {
const setting = schemaAndData(2);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -448,9 +464,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -502,9 +520,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -568,9 +588,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -613,9 +635,11 @@ module(
test("input fields of type boolean", async function (assert) {
const setting = schemaAndData(3);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
assert
@ -669,9 +693,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -732,9 +758,11 @@ module(
value: [{}],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -809,9 +837,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -870,9 +900,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -926,9 +958,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -1020,9 +1054,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
@ -1126,9 +1162,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -1147,9 +1185,11 @@ module(
test("identifier field instantly updates in the navigation tree when the input field is changed", async function (assert) {
const setting = schemaAndData(2);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
const tree = new TreeFromDOM();
@ -1181,9 +1221,11 @@ module(
test("edits are remembered when navigating between levels", async function (assert) {
const setting = schemaAndData(2);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const inputFields = new InputFieldsFromDOM();
const tree = new TreeFromDOM();
@ -1255,9 +1297,11 @@ module(
value: [],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
assert.dom(TOP_LEVEL_ADD_BTN).hasText("something");
await click(TOP_LEVEL_ADD_BTN);
@ -1274,9 +1318,11 @@ module(
test("adding an object to the root list of objects", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
assert.dom(TOP_LEVEL_ADD_BTN).hasText("level1");
@ -1333,9 +1379,11 @@ module(
],
});
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -1353,9 +1401,11 @@ module(
test("adding an object to a child list of objects", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -1380,9 +1430,11 @@ module(
test("navigating 1 level deep and adding an object to the child list of objects that's displayed as the root list", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -1404,9 +1456,11 @@ module(
test("navigating 1 level deep and adding an object to a grandchild list of objects", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
@ -1426,9 +1480,11 @@ module(
test("removing an object from the root list of objects", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();
const inputFields = new InputFieldsFromDOM();
@ -1461,9 +1517,11 @@ module(
test("navigating 1 level deep and removing an object from the child list of objects", async function (assert) {
const setting = schemaAndData(1);
await render(<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>);
await render(
<template>
<AdminSchemaThemeSettingEditor @themeId="1" @setting={{setting}} />
</template>
);
const tree = new TreeFromDOM();

View File

@ -18,9 +18,9 @@ module(
},
};
await render(<template>
<ThemeSettingsEditor @model={{model}} />
</template>);
await render(
<template><ThemeSettingsEditor @model={{model}} /></template>
);
assert.dom(".ace_line").hasText("[");
});
@ -28,9 +28,9 @@ module(
test("input is valid json", async function (assert) {
const model = [];
await render(<template>
<ThemeSettingsEditor @model={{model}} />
</template>);
await render(
<template><ThemeSettingsEditor @model={{model}} /></template>
);
await fillIn(".ace textarea", "foo");
await click("button#save");
@ -41,9 +41,9 @@ module(
test("'setting' key is present for each setting", async function (assert) {
const model = [];
await render(<template>
<ThemeSettingsEditor @model={{model}} />
</template>);
await render(
<template><ThemeSettingsEditor @model={{model}} /></template>
);
await fillIn(".ace textarea", `[{ "value": "value1" }]`);
await click("button#save");
@ -54,9 +54,9 @@ module(
test("'value' key is present for each setting", async function (assert) {
const model = [];
await render(<template>
<ThemeSettingsEditor @model={{model}} />
</template>);
await render(
<template><ThemeSettingsEditor @model={{model}} /></template>
);
await fillIn(".ace textarea", `[{ "setting": "setting1" }]`);
await click("button#save");
@ -67,9 +67,9 @@ module(
test("only 'setting' and 'value' keys are present, no others", async function (assert) {
const model = [];
await render(<template>
<ThemeSettingsEditor @model={{model}} />
</template>);
await render(
<template><ThemeSettingsEditor @model={{model}} /></template>
);
await fillIn(".ace textarea", `[{ "other_key": "other-key-1" }]`);
await click("button#save");
@ -84,9 +84,9 @@ module(
},
};
await render(<template>
<ThemeSettingsEditor @model={{model}} />
</template>);
await render(
<template><ThemeSettingsEditor @model={{model}} /></template>
);
find(".ace").aceEditor.session.doc.setValue(
JSON.stringify([{ setting: "bar", value: "bar" }])
@ -107,9 +107,9 @@ module(
},
};
await render(<template>
<ThemeSettingsEditor @model={{model}} />
</template>);
await render(
<template><ThemeSettingsEditor @model={{model}} /></template>
);
find(".ace").aceEditor.session.doc.setValue(
JSON.stringify([

View File

@ -17,13 +17,15 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it accepts a promise", async function (assert) {
const promise = Promise.resolve("data");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>
);
assert.true(true, "no error is thrown");
assert.dom(".content").hasText("data");
@ -32,13 +34,15 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it accepts a function that returns a promise", async function (assert) {
const promise = () => Promise.resolve("data");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>
);
assert.true(true, "no error is thrown");
assert.dom(".content").hasText("data");
@ -47,13 +51,15 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it accepts an RsvpPromise", async function (assert) {
const promise = RsvpPromise.resolve("data");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>
);
assert.dom(".content").hasText("data");
});
@ -61,13 +67,15 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it accepts an async function", async function (assert) {
const promise = async () => "data";
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>
);
assert.dom(".content").hasText("data");
});
@ -75,13 +83,15 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it accepts an instance of TrackedAsyncData", async function (assert) {
const promise = new TrackedAsyncData(Promise.resolve("data"));
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>
);
assert.dom(".content").hasText("data");
});
@ -94,13 +104,15 @@ module("Integration | Component | AsyncContent", function (hooks) {
return Promise.resolve("data");
};
await render(<template>
<AsyncContent @asyncData={{promise}} @context="correct">
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}} @context="correct">
<:content as |data|>
<div class="content">{{data}}</div>
</:content>
</AsyncContent>
</template>
);
assert.dom(".content").hasText("data");
});
@ -143,15 +155,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
let resolvePromise;
const promise = new Promise((resolve) => (resolvePromise = resolve));
const renderPromise = render(<template>
<div data-async-content-test>
<AsyncContent @asyncData={{promise}}>
<:content>
<div class="content"></div>
</:content>
</AsyncContent>
</div>
</template>);
const renderPromise = render(
<template>
<div data-async-content-test>
<AsyncContent @asyncData={{promise}}>
<:content>
<div class="content"></div>
</:content>
</AsyncContent>
</div>
</template>
);
// TrackedAsyncData is tangled with Ember's run loop, so we need to wait for the result of the rendering
// instead to check the loading state.
@ -168,19 +182,21 @@ module("Integration | Component | AsyncContent", function (hooks) {
let resolvePromise;
const promise = new Promise((resolve) => (resolvePromise = resolve));
const renderPromise = render(<template>
<div data-async-content-test>
<AsyncContent @asyncData={{promise}}>
<:loading>
<div class="loading-provided"></div>
</:loading>
const renderPromise = render(
<template>
<div data-async-content-test>
<AsyncContent @asyncData={{promise}}>
<:loading>
<div class="loading-provided"></div>
</:loading>
<:content>
<div class="content"></div>
</:content>
</AsyncContent>
</div>
</template>);
<:content>
<div class="content"></div>
</:content>
</AsyncContent>
</div>
</template>
);
// TrackedAsyncData is tangled with Ember's run loop, so we need to wait for the result of the rendering
// instead to check the loading state.
@ -198,15 +214,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it displays the block once the promise is fulfilled", async function (assert) {
const promise = Promise.resolve("data returned");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">
{{data}}
</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">
{{data}}
</div>
</:content>
</AsyncContent>
</template>
);
assert.dom(".content").exists();
assert.dom(".content").hasText("data returned");
@ -215,15 +233,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it does not display the block if the promise fails", async function (assert) {
const promise = Promise.reject("error");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">
{{data}}
</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content as |data|>
<div class="content">
{{data}}
</div>
</:content>
</AsyncContent>
</template>
);
assert.dom(".content").doesNotExist();
});
@ -233,15 +253,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it displays the block when the promise is resolved with an empty value", async function (assert) {
const promise = Promise.resolve(null);
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:empty>
<div class="empty">
Empty
</div>
</:empty>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:empty>
<div class="empty">
Empty
</div>
</:empty>
</AsyncContent>
</template>
);
assert.dom(".empty").exists();
});
@ -249,15 +271,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it does not display the block when the promise is resolved with a value", async function (assert) {
const promise = Promise.resolve("data");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:empty>
<div class="empty">
Empty
</div>
</:empty>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:empty>
<div class="empty">
Empty
</div>
</:empty>
</AsyncContent>
</template>
);
assert.dom(".empty").doesNotExist();
});
@ -265,15 +289,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it displays the content block if the the empty block is not provided", async function (assert) {
const promise = Promise.resolve(null);
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:content>
<div class="content">
Empty
</div>
</:content>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:content>
<div class="content">
Empty
</div>
</:content>
</AsyncContent>
</template>
);
assert.dom(".content").exists();
});
@ -281,15 +307,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it does not display the block if the promise fails", async function (assert) {
const promise = Promise.reject("error");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:empty>
<div class="empty">
Empty
</div>
</:empty>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:empty>
<div class="empty">
Empty
</div>
</:empty>
</AsyncContent>
</template>
);
assert.dom(".empty").doesNotExist();
});
@ -299,9 +327,9 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it displays an inline error dialog when the block is not provided", async function (assert) {
const promise = Promise.reject("error");
await render(<template>
<AsyncContent @asyncData={{promise}} />
</template>);
await render(
<template><AsyncContent @asyncData={{promise}} /></template>
);
assert.dom(".alert-error").exists();
assert.dom(".alert-error").hasText("Sorry, an error has occurred.");
@ -310,10 +338,12 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it displays a popup error dialog when the block is not provided", async function (assert) {
const promise = Promise.reject("error");
await render(<template>
<AsyncContent @asyncData={{promise}} @errorMode="popup" />
<DialogHolder />
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}} @errorMode="popup" />
<DialogHolder />
</template>
);
assert.dom(".dialog-body").exists();
assert.dom(".dialog-body").hasText("Sorry, an error has occurred.");
@ -322,15 +352,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it displays the block when the promise is rejected", async function (assert) {
const promise = Promise.reject("error");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:error as |error|>
<div class="error">
{{error}}
</div>
</:error>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:error as |error|>
<div class="error">
{{error}}
</div>
</:error>
</AsyncContent>
</template>
);
assert.dom(".error").exists();
assert.dom(".error").hasText("error");
@ -339,15 +371,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it does not display the block when the promise is resolved", async function (assert) {
const promise = Promise.resolve("data");
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:error as |error|>
<div class="error">
{{error}}
</div>
</:error>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:error as |error|>
<div class="error">
{{error}}
</div>
</:error>
</AsyncContent>
</template>
);
assert.dom(".error").doesNotExist();
});
@ -355,15 +389,17 @@ module("Integration | Component | AsyncContent", function (hooks) {
test("it does not display the block when the promise is resolved with an empty value", async function (assert) {
const promise = Promise.resolve(null);
await render(<template>
<AsyncContent @asyncData={{promise}}>
<:error as |error|>
<div class="error">
{{error}}
</div>
</:error>
</AsyncContent>
</template>);
await render(
<template>
<AsyncContent @asyncData={{promise}}>
<:error as |error|>
<div class="error">
{{error}}
</div>
</:error>
</AsyncContent>
</template>
);
assert.dom(".error").doesNotExist();
});

View File

@ -21,9 +21,11 @@ module("Integration | Component | avatar-uploader", function (hooks) {
done();
};
await render(<template>
<AvatarUploader @id="avatar-uploader" @done={{callback}} />
</template>);
await render(
<template>
<AvatarUploader @id="avatar-uploader" @done={{callback}} />
</template>
);
await this.container
.lookup("service:app-events")

View File

@ -54,7 +54,11 @@ module("Integration | Component | Chart", function (hooks) {
};
const chartConfig = generateChartConfig(this.model);
await render(<template><canvas class="empty-canvas"></canvas></template>);
await render(
<template>
<canvas class="empty-canvas"></canvas>
</template>
);
const emptyCanvasDataURL = await renderAsPNGURL(
document.querySelector("canvas.empty-canvas")
);
@ -81,9 +85,9 @@ module("Integration | Component | Chart", function (hooks) {
testState.chartConfig = generateChartConfig(this.model);
await render(<template>
<Chart @chartConfig={{testState.chartConfig}} />
</template>);
await render(
<template><Chart @chartConfig={{testState.chartConfig}} /></template>
);
const firstCanvasDataURL = await renderAsPNGURL(
document.querySelector("canvas.chart-canvas")
);

View File

@ -100,9 +100,9 @@ module("Integration | Component | ColorPaletteEditor", function (hooks) {
},
];
await render(<template>
<ColorPaletteEditor @colors={{colors}} />
</template>);
await render(
<template><ColorPaletteEditor @colors={{colors}} /></template>
);
assert.true(
this.subject.isActiveModeLight(),
@ -180,9 +180,9 @@ module("Integration | Component | ColorPaletteEditor", function (hooks) {
},
];
await render(<template>
<ColorPaletteEditor @colors={{colors}} />
</template>);
await render(
<template><ColorPaletteEditor @colors={{colors}} /></template>
);
assert.strictEqual(
this.subject.color("my_awesome_color").displayName(),
@ -219,13 +219,15 @@ module("Integration | Component | ColorPaletteEditor", function (hooks) {
darkChanges.push([name, value]);
};
await render(<template>
<ColorPaletteEditor
@colors={{colors}}
@onLightColorChange={{onLightColorChange}}
@onDarkColorChange={{onDarkColorChange}}
/>
</template>);
await render(
<template>
<ColorPaletteEditor
@colors={{colors}}
@onLightColorChange={{onLightColorChange}}
@onDarkColorChange={{onDarkColorChange}}
/>
</template>
);
await this.subject.color("primary").sendInputEvent("#abcdef");

View File

@ -10,9 +10,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
test("typing an email address in the restrictTo field", async function (assert) {
const model = {};
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
@ -62,9 +62,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
this.currentUser.admin = true;
this.siteSettings.must_approve_users = true;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.false(
@ -73,9 +73,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
);
this.siteSettings.must_approve_users = false;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.true(
@ -85,9 +85,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
this.currentUser.set("admin", false);
this.currentUser.set("moderator", false);
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.false(
@ -100,9 +100,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
const model = {};
this.siteSettings.invite_link_max_redemptions_limit_users = 11;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.strictEqual(
@ -113,9 +113,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
this.siteSettings.invite_link_max_redemptions_limit_users = 9;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.strictEqual(
@ -130,9 +130,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
this.currentUser.set("moderator", true);
this.siteSettings.invite_link_max_redemptions_limit = 111;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.strictEqual(
@ -143,9 +143,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
this.siteSettings.invite_link_max_redemptions_limit = 98;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.strictEqual(
@ -159,9 +159,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
const model = {};
this.siteSettings.invite_expiry_days = 3;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.deepEqual(
@ -172,9 +172,9 @@ module("Integration | Component | CreateInvite", function (hooks) {
this.siteSettings.invite_expiry_days = 90;
await render(<template>
<CreateInvite @inline={{true}} @model={{model}} />
</template>);
await render(
<template><CreateInvite @inline={{true}} @model={{model}} /></template>
);
await click(".edit-link-options");
assert.deepEqual(

View File

@ -11,11 +11,16 @@ module(
setupRenderingTest(hooks);
test("it renders a DBreadcrumbsContainer with multiple DBreadcrumbsItems", async function (assert) {
await render(<template>
<DBreadcrumbsContainer />
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem @path="/about" @label={{i18n "about.simple_title"}} />
</template>);
await render(
<template>
<DBreadcrumbsContainer />
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
<DBreadcrumbsItem
@path="/about"
@label={{i18n "about.simple_title"}}
/>
</template>
);
assert
.dom(".d-breadcrumbs .d-breadcrumbs__item .d-breadcrumbs__link")
@ -23,13 +28,15 @@ module(
});
test("it renders a DBreadcrumbsItem with additional link and item classes", async function (assert) {
await render(<template>
<DBreadcrumbsContainer
@additionalLinkClasses="some-class"
@additionalItemClasses="other-class"
/>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
</template>);
await render(
<template>
<DBreadcrumbsContainer
@additionalLinkClasses="some-class"
@additionalItemClasses="other-class"
/>
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
</template>
);
assert.dom(".d-breadcrumbs .d-breadcrumbs__item.other-class").exists();
assert
@ -40,11 +47,13 @@ module(
});
test("it renders multiple DBreadcrumbsContainer elements with the same DBreadcrumbsItem links", async function (assert) {
await render(<template>
<DBreadcrumbsContainer />
<DBreadcrumbsContainer />
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
</template>);
await render(
<template>
<DBreadcrumbsContainer />
<DBreadcrumbsContainer />
<DBreadcrumbsItem @path="/admin" @label={{i18n "admin_title"}} />
</template>
);
assert.dom(".d-breadcrumbs").exists({ count: 2 });
assert.dom(".d-breadcrumbs .d-breadcrumbs__item").exists({ count: 2 });

View File

@ -12,29 +12,33 @@ module("Integration | Component | d-modal", function (hooks) {
setupRenderingTest(hooks);
test("title and subtitle", async function (assert) {
await render(<template>
<DModal
@inline={{true}}
@title="Modal Title"
@subtitle="Modal Subtitle"
/>
</template>);
await render(
<template>
<DModal
@inline={{true}}
@title="Modal Title"
@subtitle="Modal Subtitle"
/>
</template>
);
assert.dom(".d-modal .d-modal__title-text").hasText("Modal Title");
assert.dom(".d-modal .d-modal__subtitle-text").hasText("Modal Subtitle");
});
test("named blocks", async function (assert) {
await render(<template>
<DModal @inline={{true}}>
<:aboveHeader>aboveHeaderContent</:aboveHeader>
<:headerAboveTitle>headerAboveTitleContent</:headerAboveTitle>
<:headerBelowTitle>headerBelowTitleContent</:headerBelowTitle>
<:belowHeader>belowHeaderContent</:belowHeader>
<:body>bodyContent</:body>
<:footer>footerContent</:footer>
<:belowFooter>belowFooterContent</:belowFooter>
</DModal>
</template>);
await render(
<template>
<DModal @inline={{true}}>
<:aboveHeader>aboveHeaderContent</:aboveHeader>
<:headerAboveTitle>headerAboveTitleContent</:headerAboveTitle>
<:headerBelowTitle>headerBelowTitleContent</:headerBelowTitle>
<:belowHeader>belowHeaderContent</:belowHeader>
<:body>bodyContent</:body>
<:footer>footerContent</:footer>
<:belowFooter>belowFooterContent</:belowFooter>
</DModal>
</template>
);
assert.dom(".d-modal").includesText("aboveHeaderContent");
assert.dom(".d-modal").includesText("headerAboveTitleContent");
@ -46,53 +50,67 @@ module("Integration | Component | d-modal", function (hooks) {
});
test("headerPrimaryAction block", async function (assert) {
await render(<template>
<DModal @inline={{true}} @title="test">
<:headerPrimaryAction>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>);
await render(
<template>
<DModal @inline={{true}} @title="test">
<:headerPrimaryAction
>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>
);
assert.dom(".d-modal").doesNotIncludeText("headerPrimaryActionContent");
await render(<template>
<DModal @inline={{true}} @title="test" @closeModal={{noop}}>
<:headerPrimaryAction>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>);
await render(
<template>
<DModal @inline={{true}} @title="test" @closeModal={{noop}}>
<:headerPrimaryAction
>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>
);
assert.dom(".d-modal").doesNotIncludeText("headerPrimaryActionContent");
this.site.mobileView = true;
await render(<template>
<DModal @inline={{true}} @title="test" @closeModal={{noop}}>
<:headerPrimaryAction>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>);
await render(
<template>
<DModal @inline={{true}} @title="test" @closeModal={{noop}}>
<:headerPrimaryAction
>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>
);
assert.dom(".d-modal").includesText("headerPrimaryActionContent");
assert.dom(".d-modal__dismiss-action-button").exists();
await render(<template>
<DModal @inline={{true}} @title="test">
<:headerPrimaryAction>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>);
await render(
<template>
<DModal @inline={{true}} @title="test">
<:headerPrimaryAction
>headerPrimaryActionContent</:headerPrimaryAction>
</DModal>
</template>
);
assert.dom(".d-modal__dismiss-action-button").doesNotExist();
});
test("flash", async function (assert) {
await render(<template>
<DModal @inline={{true}} @flash="Some message" />
</template>);
await render(
<template><DModal @inline={{true}} @flash="Some message" /></template>
);
assert.dom(".d-modal .alert").hasText("Some message");
});
test("flash type", async function (assert) {
await render(<template>
<DModal @inline={{true}} @flash="Some message" @flashType="success" />
</template>);
await render(
<template>
<DModal @inline={{true}} @flash="Some message" @flashType="success" />
</template>
);
assert.dom(".d-modal .alert").hasClass("alert-success");
});
@ -108,13 +126,15 @@ module("Integration | Component | d-modal", function (hooks) {
const testState = new TestState();
testState.dismissable = false;
await render(<template>
<DModal
@inline={{true}}
@closeModal={{testState.closeModal}}
@dismissable={{testState.dismissable}}
/>
</template>);
await render(
<template>
<DModal
@inline={{true}}
@closeModal={{testState.closeModal}}
@dismissable={{testState.dismissable}}
/>
</template>
);
assert
.dom(".d-modal .modal-close")
@ -134,14 +154,16 @@ module("Integration | Component | d-modal", function (hooks) {
});
test("header and body classes", async function (assert) {
await render(<template>
<DModal
@inline={{true}}
@bodyClass="my-body-class"
@headerClass="my-header-class"
@title="Hello world"
/>
</template>);
await render(
<template>
<DModal
@inline={{true}}
@bodyClass="my-body-class"
@headerClass="my-header-class"
@title="Hello world"
/>
</template>
);
assert.dom(".d-modal .d-modal__header").hasClass("my-header-class");
assert.dom(".d-modal .d-modal__body").hasClass("my-body-class");
@ -154,16 +176,18 @@ module("Integration | Component | d-modal", function (hooks) {
submittedFormData = new FormData(event.currentTarget);
};
await render(<template>
<DModal @inline={{true}} @tagName="form" {{on "submit" handleSubmit}}>
<:body>
<input type="text" name="name" value="John Doe" />
</:body>
<:footer>
<button type="submit">Submit</button>
</:footer>
</DModal>
</template>);
await render(
<template>
<DModal @inline={{true}} @tagName="form" {{on "submit" handleSubmit}}>
<:body>
<input type="text" name="name" value="John Doe" />
</:body>
<:footer>
<button type="submit">Submit</button>
</:footer>
</DModal>
</template>
);
assert.dom("form.d-modal").exists();
await click(".d-modal button[type=submit]");
@ -176,20 +200,22 @@ module("Integration | Component | d-modal", function (hooks) {
actionCalled = true;
};
await render(<template>
<DModal @inline={{true}}>
<:body>
body content
</:body>
<:footer>
<DButton
@action={{someAction}}
@translatedLabel="Perform action"
class="btn-primary"
/>
</:footer>
</DModal>
</template>);
await render(
<template>
<DModal @inline={{true}}>
<:body>
body content
</:body>
<:footer>
<DButton
@action={{someAction}}
@translatedLabel="Perform action"
class="btn-primary"
/>
</:footer>
</DModal>
</template>
);
await triggerKeyEvent(".d-modal__body", "keydown", "Enter");

View File

@ -28,30 +28,34 @@ module("Integration | Component | DPageHeader", function (hooks) {
});
test("@titleLabel", async function (assert) {
await render(<template>
<DPageHeader @titleLabel={{i18n "admin.title"}} />
</template>);
await render(
<template><DPageHeader @titleLabel={{i18n "admin.title"}} /></template>
);
assert.dom(".d-page-header__title").exists().hasText(i18n("admin.title"));
});
test("@shouldDisplay", async function (assert) {
await render(<template>
<DPageHeader @titleLabel="Wow so cool" @shouldDisplay={{false}} />
</template>);
await render(
<template>
<DPageHeader @titleLabel="Wow so cool" @shouldDisplay={{false}} />
</template>
);
assert.dom(".d-page-header").doesNotExist();
});
test("renders base breadcrumbs and yielded <:breadcrumbs>", async function (assert) {
await render(<template>
<DPageHeader @titleLabel={{i18n "admin.titile"}}>
<:breadcrumbs>
<DBreadcrumbsItem
@path="/admin/badges"
@label={{i18n "admin.badges.title"}}
/>
</:breadcrumbs>
</DPageHeader>
</template>);
await render(
<template>
<DPageHeader @titleLabel={{i18n "admin.titile"}}>
<:breadcrumbs>
<DBreadcrumbsItem
@path="/admin/badges"
@label={{i18n "admin.badges.title"}}
/>
</:breadcrumbs>
</DPageHeader>
</template>
);
assert
.dom(".d-page-header__breadcrumbs .d-breadcrumbs__item")
@ -67,9 +71,11 @@ module("Integration | Component | DPageHeader", function (hooks) {
});
test("@descriptionLabel", async function (assert) {
await render(<template>
<DPageHeader @descriptionLabel={{i18n "admin.badges.description"}} />
</template>);
await render(
<template>
<DPageHeader @descriptionLabel={{i18n "admin.badges.description"}} />
</template>
);
assert
.dom(".d-page-header__description")
.exists()
@ -82,12 +88,14 @@ module("Integration | Component | DPageHeader", function (hooks) {
});
test("@learnMoreUrl", async function (assert) {
await render(<template>
<DPageHeader
@descriptionLabel={{i18n "admin.badges.description"}}
@learnMoreUrl="https://meta.discourse.org/t/96331"
/>
</template>);
await render(
<template>
<DPageHeader
@descriptionLabel={{i18n "admin.badges.description"}}
@learnMoreUrl="https://meta.discourse.org/t/96331"
/>
</template>
);
assert.dom(".d-page-header__learn-more").exists();
assert
.dom(".d-page-header__learn-more a")
@ -96,17 +104,19 @@ module("Integration | Component | DPageHeader", function (hooks) {
});
test("renders nav tabs in yielded <:tabs>", async function (assert) {
await render(<template>
<DPageHeader>
<:tabs>
<NavItem
@route="admin.backups.settings"
@label="settings"
class="d-backups-tabs__settings"
/>
</:tabs>
</DPageHeader>
</template>);
await render(
<template>
<DPageHeader>
<:tabs>
<NavItem
@route="admin.backups.settings"
@label="settings"
class="d-backups-tabs__settings"
/>
</:tabs>
</DPageHeader>
</template>
);
assert
.dom(".d-nav-submenu__tabs .d-backups-tabs__settings")
.exists()
@ -119,35 +129,37 @@ module("Integration | Component | DPageHeader", function (hooks) {
actionCalled = true;
};
await render(<template>
<DPageHeader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
await render(
<template>
<DPageHeader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
<actions.Danger
@action={{someAction}}
@title="admin.badges.group_settings"
@label="admin.badges.group_settings"
@icon="gear"
class="edit-groupings-btn"
/>
</:actions>
</DPageHeader>
</template>);
<actions.Danger
@action={{someAction}}
@title="admin.badges.group_settings"
@label="admin.badges.group_settings"
@icon="gear"
class="edit-groupings-btn"
/>
</:actions>
</DPageHeader>
</template>
);
assert
.dom(
@ -170,9 +182,13 @@ module("Integration | Component | DPageHeader", function (hooks) {
});
test("@headerActionComponent is rendered with actions arg", async function (assert) {
await render(<template>
<DPageHeader @headerActionComponent={{DPageHeaderActionsTestComponent}} />
</template>);
await render(
<template>
<DPageHeader
@headerActionComponent={{DPageHeaderActionsTestComponent}}
/>
</template>
);
assert.dom(".d-page-header-actions-test-component .award-badge").exists();
});
@ -186,27 +202,29 @@ module("Integration | Component | DPageHeader | Mobile", function (hooks) {
setupRenderingTest(hooks);
test("action buttons become a dropdown on mobile", async function (assert) {
await render(<template>
<DPageHeader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
await render(
<template>
<DPageHeader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
</:actions>
</DPageHeader>
</template>);
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
</:actions>
</DPageHeader>
</template>
);
assert
.dom(

View File

@ -9,9 +9,9 @@ module("Integration | Component | DPageSubheader", function (hooks) {
setupRenderingTest(hooks);
test("@titleLabel", async function (assert) {
await render(<template>
<DPageSubheader @titleLabel={{i18n "admin.title"}} />
</template>);
await render(
<template><DPageSubheader @titleLabel={{i18n "admin.title"}} /></template>
);
assert
.dom(".d-page-subheader__title")
.exists()
@ -24,9 +24,11 @@ module("Integration | Component | DPageSubheader", function (hooks) {
});
test("@descriptionLabel", async function (assert) {
await render(<template>
<DPageSubheader @descriptionLabel={{i18n "admin.badges.description"}} />
</template>);
await render(
<template>
<DPageSubheader @descriptionLabel={{i18n "admin.badges.description"}} />
</template>
);
assert
.dom(".d-page-subheader__description")
.exists()
@ -39,12 +41,14 @@ module("Integration | Component | DPageSubheader", function (hooks) {
});
test("@learnMoreUrl", async function (assert) {
await render(<template>
<DPageSubheader
@descriptionLabel={{i18n "admin.badges.description"}}
@learnMoreUrl="https://meta.discourse.org/t/96331"
/>
</template>);
await render(
<template>
<DPageSubheader
@descriptionLabel={{i18n "admin.badges.description"}}
@learnMoreUrl="https://meta.discourse.org/t/96331"
/>
</template>
);
assert.dom(".d-page-subheader__learn-more").exists();
assert
.dom(".d-page-subheader__learn-more a")
@ -58,35 +62,37 @@ module("Integration | Component | DPageSubheader", function (hooks) {
actionCalled = true;
};
await render(<template>
<DPageSubheader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
await render(
<template>
<DPageSubheader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
<actions.Danger
@action={{someAction}}
@title="admin.badges.group_settings"
@label="admin.badges.group_settings"
@icon="gear"
class="edit-groupings-btn"
/>
</:actions>
</DPageSubheader>
</template>);
<actions.Danger
@action={{someAction}}
@title="admin.badges.group_settings"
@label="admin.badges.group_settings"
@icon="gear"
class="edit-groupings-btn"
/>
</:actions>
</DPageSubheader>
</template>
);
assert
.dom(
@ -117,27 +123,29 @@ module("Integration | Component | DPageSubheader | Mobile", function (hooks) {
setupRenderingTest(hooks);
test("action buttons become a dropdown on mobile", async function (assert) {
await render(<template>
<DPageSubheader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
await render(
<template>
<DPageSubheader>
<:actions as |actions|>
<actions.Primary
@route="adminBadges.show"
@routeModels="new"
@icon="plus"
@label="admin.badges.new"
class="new-badge"
/>
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
</:actions>
</DPageSubheader>
</template>);
<actions.Default
@route="adminBadges.award"
@routeModels="new"
@icon="upload"
@label="admin.badges.mass_award.title"
class="award-badge"
/>
</:actions>
</DPageSubheader>
</template>
);
assert
.dom(

View File

@ -9,11 +9,13 @@ module("Integration | Component | d-section", function (hooks) {
test("can set classes on the body element", async function (assert) {
await withSilencedDeprecationsAsync("discourse.d-section", async () => {
await render(<template>
<DSection @pageClass="test" @bodyClass="foo bar" class="special">
testing!
</DSection>
</template>);
await render(
<template>
<DSection @pageClass="test" @bodyClass="foo bar" class="special">
testing!
</DSection>
</template>
);
});
assert.dom(".special").hasText("testing!");

View File

@ -12,11 +12,13 @@ module("Integration | Component | d-select", function (hooks) {
assert.step(value);
};
await render(<template>
<DSelect @onChange={{handleChange}} as |s|>
<s.Option @value="foo">The real foo</s.Option>
</DSelect>
</template>);
await render(
<template>
<DSelect @onChange={{handleChange}} as |s|>
<s.Option @value="foo">The real foo</s.Option>
</DSelect>
</template>
);
await select(".d-select", "foo");
@ -33,11 +35,13 @@ module("Integration | Component | d-select", function (hooks) {
});
test("selected value", async function (assert) {
await render(<template>
<DSelect @value="foo" as |s|>
<s.Option @value="foo">The real foo</s.Option>
</DSelect>
</template>);
await render(
<template>
<DSelect @value="foo" as |s|>
<s.Option @value="foo">The real foo</s.Option>
</DSelect>
</template>
);
assert.dselect().hasOption({
value: NO_VALUE_OPTION,
@ -51,11 +55,13 @@ module("Integration | Component | d-select", function (hooks) {
});
test("required field", async function (assert) {
await render(<template>
<DSelect @includeNone={{false}} as |s|>
<s.Option @value="foo">The real foo</s.Option>
</DSelect>
</template>);
await render(
<template>
<DSelect @includeNone={{false}} as |s|>
<s.Option @value="foo">The real foo</s.Option>
</DSelect>
</template>
);
assert.dselect().hasNoOption(NO_VALUE_OPTION);
});
@ -67,11 +73,13 @@ module("Integration | Component | d-select", function (hooks) {
});
test("option attributes", async function (assert) {
await render(<template>
<DSelect as |s|>
<s.Option @value="foo" class="test">The real foo</s.Option>
</DSelect>
</template>);
await render(
<template>
<DSelect as |s|>
<s.Option @value="foo" class="test">The real foo</s.Option>
</DSelect>
</template>
);
assert.dom(".d-select__option.test").exists();
});

View File

@ -8,11 +8,13 @@ module("Integration | Component | DStatTiles", function (hooks) {
setupRenderingTest(hooks);
test("formats the @value in a readable way with the raw number as the title attr", async function (assert) {
await render(<template>
<DStatTiles as |tiles|>
<tiles.Tile @value="12555999" @label={{i18n "bootstrap_mode"}} />
</DStatTiles>
</template>);
await render(
<template>
<DStatTiles as |tiles|>
<tiles.Tile @value="12555999" @label={{i18n "bootstrap_mode"}} />
</DStatTiles>
</template>
);
assert
.dom(".d-stat-tiles .d-stat-tile .d-stat-tile__value")
@ -23,11 +25,13 @@ module("Integration | Component | DStatTiles", function (hooks) {
});
test("renders the @label", async function (assert) {
await render(<template>
<DStatTiles as |tiles|>
<tiles.Tile @value="12555999" @label={{i18n "bootstrap_mode"}} />
</DStatTiles>
</template>);
await render(
<template>
<DStatTiles as |tiles|>
<tiles.Tile @value="12555999" @label={{i18n "bootstrap_mode"}} />
</DStatTiles>
</template>
);
assert
.dom(".d-stat-tiles .d-stat-tile .d-stat-tile__label")
@ -35,15 +39,17 @@ module("Integration | Component | DStatTiles", function (hooks) {
});
test("renders the optional @tooltip", async function (assert) {
await render(<template>
<DStatTiles as |tiles|>
<tiles.Tile
@value="12555999"
@label={{i18n "bootstrap_mode"}}
@tooltip={{i18n "bootstrap_mode"}}
/>
</DStatTiles>
</template>);
await render(
<template>
<DStatTiles as |tiles|>
<tiles.Tile
@value="12555999"
@label={{i18n "bootstrap_mode"}}
@tooltip={{i18n "bootstrap_mode"}}
/>
</DStatTiles>
</template>
);
assert.dom(".d-stat-tile__tooltip").exists();
await triggerEvent(".fk-d-tooltip__trigger", "pointermove");
@ -51,15 +57,17 @@ module("Integration | Component | DStatTiles", function (hooks) {
});
test("wraps the value in a link if @url is provided", async function (assert) {
await render(<template>
<DStatTiles as |tiles|>
<tiles.Tile
@value="12555999"
@label={{i18n "bootstrap_mode"}}
@url="https://meta.discourse.org"
/>
</DStatTiles>
</template>);
await render(
<template>
<DStatTiles as |tiles|>
<tiles.Tile
@value="12555999"
@label={{i18n "bootstrap_mode"}}
@url="https://meta.discourse.org"
/>
</DStatTiles>
</template>
);
assert
.dom(".d-stat-tiles .d-stat-tile a.d-stat-tile__value")

View File

@ -30,14 +30,19 @@ module("Integration | Component | <DecoratedHtml />", function (hooks) {
const decorate = (element, helper) => {
element.innerHTML += "<div id='appended'>Appended</div>";
helper.renderGlimmer(element, <template>
<div id="render-glimmer">Hello from Glimmer Component</div>
</template>);
helper.renderGlimmer(
element,
<template>
<div id="render-glimmer">Hello from Glimmer Component</div>
</template>
);
};
await render(<template>
<DecoratedHtml @html={{state.html}} @decorate={{decorate}} />
</template>);
await render(
<template>
<DecoratedHtml @html={{state.html}} @decorate={{decorate}} />
</template>
);
assert.dom("h1").hasText("Initial");
assert.dom("#appended").hasText("Appended");

View File

@ -15,9 +15,13 @@ module("Integration | Component | <DropdownMenu />", function (hooks) {
});
test("dropdown menu item", async function (assert) {
await render(<template>
<DropdownMenu as |dm|><dm.item class="test">test</dm.item></DropdownMenu>
</template>);
await render(
<template>
<DropdownMenu as |dm|><dm.item
class="test"
>test</dm.item></DropdownMenu>
</template>
);
assert
.dom("li.dropdown-menu__item.test")
@ -26,9 +30,11 @@ module("Integration | Component | <DropdownMenu />", function (hooks) {
});
test("dropdown menu divider", async function (assert) {
await render(<template>
<DropdownMenu as |dm|><dm.divider class="test" /></DropdownMenu>
</template>);
await render(
<template>
<DropdownMenu as |dm|><dm.divider class="test" /></DropdownMenu>
</template>
);
assert
.dom("li.test hr.dropdown-menu__divider")

View File

@ -10,9 +10,9 @@ module("Integration | Component | flash-message", function (hooks) {
const flash = "Success message";
const type = "success";
await render(<template>
<FlashMessage @flash={{flash}} @type={{type}} />
</template>);
await render(
<template><FlashMessage @flash={{flash}} @type={{type}} /></template>
);
assert.dom(".alert.alert-success").hasText(flash);
assert.dom(".alert").hasClass("alert-success");
@ -22,9 +22,9 @@ module("Integration | Component | flash-message", function (hooks) {
const flash = "Error message";
const type = "error";
await render(<template>
<FlashMessage @flash={{flash}} @type={{type}} />
</template>);
await render(
<template><FlashMessage @flash={{flash}} @type={{type}} /></template>
);
assert.dom(".alert.alert-error").hasText(flash);
assert.dom(".alert").hasClass("alert-error");
@ -34,9 +34,9 @@ module("Integration | Component | flash-message", function (hooks) {
const flash = "Warning message";
const type = "warning";
await render(<template>
<FlashMessage @flash={{flash}} @type={{type}} />
</template>);
await render(
<template><FlashMessage @flash={{flash}} @type={{type}} /></template>
);
assert.dom(".alert.alert-warning").hasText(flash);
assert.dom(".alert").hasClass("alert-warning");
@ -46,9 +46,9 @@ module("Integration | Component | flash-message", function (hooks) {
const flash = "Info message";
const type = "info";
await render(<template>
<FlashMessage @flash={{flash}} @type={{type}} />
</template>);
await render(
<template><FlashMessage @flash={{flash}} @type={{type}} /></template>
);
assert.dom(".alert.alert-info").hasText(flash);
assert.dom(".alert").hasClass("alert-info");

View File

@ -9,44 +9,50 @@ module("Integration | Component | FormKit | Collection", function (hooks) {
setupRenderingTest(hooks);
test("@tagName", async function (assert) {
await render(<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Collection @name="foo" @tagName="tr" />
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Collection @name="foo" @tagName="tr" />
</Form>
</template>
);
assert.dom("tr.form-kit__collection").exists();
});
test("field", async function (assert) {
await render(<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Collection @name="foo" as |collection|>
<collection.Field @name="bar" @title="Bar" as |field|>
<field.Input />
</collection.Field>
</form.Collection>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Collection @name="foo" as |collection|>
<collection.Field @name="bar" @title="Bar" as |field|>
<field.Input />
</collection.Field>
</form.Collection>
</Form>
</template>
);
assert.form().field("foo.0.bar").hasValue("1");
assert.form().field("foo.1.bar").hasValue("2");
});
test("remove", async function (assert) {
await render(<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Collection @name="foo" as |collection index|>
<collection.Field @name="bar" @title="Bar" as |field|>
<field.Input />
<form.Button
class={{concat "remove-" index}}
@action={{fn collection.remove index}}
>Remove</form.Button>
</collection.Field>
</form.Collection>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Collection @name="foo" as |collection index|>
<collection.Field @name="bar" @title="Bar" as |field|>
<field.Input />
<form.Button
class={{concat "remove-" index}}
@action={{fn collection.remove index}}
>Remove</form.Button>
</collection.Field>
</form.Collection>
</Form>
</template>
);
assert.form().field("foo.0.bar").hasValue("1");
assert.form().field("foo.1.bar").hasValue("2");
@ -58,26 +64,28 @@ module("Integration | Component | FormKit | Collection", function (hooks) {
});
test("nested object", async function (assert) {
await render(<template>
<Form
@data={{hash
foo=(array (hash bar=(hash baz=1)) (hash bar=(hash baz=2)))
}}
as |form|
>
<form.Collection @name="foo" as |collection index|>
<collection.Object @name="bar" as |object|>
<object.Field @name="baz" @title="Baz" as |field|>
<field.Input />
<form.Button
class={{concat "remove-" index}}
@action={{fn collection.remove index}}
>Remove</form.Button>
</object.Field>
</collection.Object>
</form.Collection>
</Form>
</template>);
await render(
<template>
<Form
@data={{hash
foo=(array (hash bar=(hash baz=1)) (hash bar=(hash baz=2)))
}}
as |form|
>
<form.Collection @name="foo" as |collection index|>
<collection.Object @name="bar" as |object|>
<object.Field @name="baz" @title="Baz" as |field|>
<field.Input />
<form.Button
class={{concat "remove-" index}}
@action={{fn collection.remove index}}
>Remove</form.Button>
</object.Field>
</collection.Object>
</form.Collection>
</Form>
</template>
);
assert.form().field("foo.0.bar.baz").hasValue("1");
assert.form().field("foo.1.bar.baz").hasValue("2");
@ -93,37 +101,39 @@ module("Integration | Component | FormKit | Collection", function (hooks) {
});
test("nested collection", async function (assert) {
await render(<template>
<Form
@data={{hash
one=(array
(hash two=(array (hash three=(array (hash foo=1) (hash foo=2)))))
)
}}
as |form|
>
<form.Collection @name="one" as |first firstIndex|>
<first.Collection @name="two" as |second secondIndex|>
<second.Collection @name="three" as |third thirdIndex|>
<third.Field @name="foo" @title="Foo" as |field|>
<field.Input />
<form.Button
class={{concat
"remove-"
firstIndex
"-"
secondIndex
"-"
thirdIndex
}}
@action={{fn third.remove thirdIndex}}
>Remove</form.Button>
</third.Field>
</second.Collection>
</first.Collection>
</form.Collection>
</Form>
</template>);
await render(
<template>
<Form
@data={{hash
one=(array
(hash two=(array (hash three=(array (hash foo=1) (hash foo=2)))))
)
}}
as |form|
>
<form.Collection @name="one" as |first firstIndex|>
<first.Collection @name="two" as |second secondIndex|>
<second.Collection @name="three" as |third thirdIndex|>
<third.Field @name="foo" @title="Foo" as |field|>
<field.Input />
<form.Button
class={{concat
"remove-"
firstIndex
"-"
secondIndex
"-"
thirdIndex
}}
@action={{fn third.remove thirdIndex}}
>Remove</form.Button>
</third.Field>
</second.Collection>
</first.Collection>
</form.Collection>
</Form>
</template>
);
assert.form().field("one.0.two.0.three.0.foo").hasValue("1");
assert.form().field("one.0.two.0.three.1.foo").hasValue("2");

View File

@ -14,13 +14,15 @@ module(
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>
);
await formKit().field("foo").setDay(22);
await formKit().field("foo").setTime("11:12");
@ -32,46 +34,54 @@ module(
});
test("@includeTime", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-time").exists();
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar @includeTime={{false}} />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar @includeTime={{false}} />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-time").doesNotExist();
});
test("@expandedDatePickerOnDesktop", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>
);
assert.dom(".date-picker-container").exists();
assert.dom(".form-kit__control-date").doesNotExist();
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar @expandedDatePickerOnDesktop={{false}} />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Calendar @expandedDatePickerOnDesktop={{false}} />
</form.Field>
</Form>
</template>
);
assert.dom(".date-picker-container").doesNotExist();
assert.dom(".form-kit__control-date").exists();
@ -83,18 +93,20 @@ module(
const date = moment().subtract(2, "days");
const validation = `dateBeforeOrEqual:${date.format("YYYY-MM-DD")}`;
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field
@validation={{validation}}
@name="foo"
@title="Foo"
as |field|
>
<field.Calendar />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field
@validation={{validation}}
@name="foo"
@title="Foo"
as |field|
>
<field.Calendar />
</form.Field>
</Form>
</template>
);
await formKit().submit();
@ -114,18 +126,20 @@ module(
const date = moment().add(2, "days");
const validation = `dateAfterOrEqual:${date.format("YYYY-MM-DD")}`;
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field
@validation={{validation}}
@name="foo"
@title="Foo"
as |field|
>
<field.Calendar />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field
@validation={{validation}}
@name="foo"
@title="Foo"
as |field|
>
<field.Calendar />
</form.Field>
</Form>
</template>
);
await formKit().submit();
@ -140,13 +154,15 @@ module(
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Calendar />
</form.Field>
</Form>
</template>
);
assert.dom(".pika-button.pika-day").hasStyle({
"pointer-events": "none",

View File

@ -13,18 +13,20 @@ module(
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="length:0,5"
as |field|
>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="length:0,5"
as |field|
>
<field.Input />
</form.Field>
</Form>
</template>
);
assert.form().field("foo").hasCharCounter(0, 5);

View File

@ -13,13 +13,15 @@ module(
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: null });
assert.form().field("foo").hasValue(false);
@ -34,25 +36,29 @@ module(
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-checkbox").hasAttribute("disabled");
});
test("@tooltip", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @tooltip="test" @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @tooltip="test" @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>
);
assert
.dom(".form-kit__control-checkbox-content .form-kit__tooltip")
@ -60,13 +66,15 @@ module(
});
test("optional", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</form.Field>
</Form>
</template>
);
assert.form().field("foo").hasTitle("Foo (optional)");
});

View File

@ -11,13 +11,15 @@ module("Integration | Component | FormKit | Controls | Code", function (hooks) {
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Code @height={{100}} style="width: 200px" />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Code @height={{100}} style="width: 200px" />
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: null });
assert.form().field("foo").hasValue("");
@ -30,13 +32,15 @@ module("Integration | Component | FormKit | Controls | Code", function (hooks) {
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Code />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Code />
</form.Field>
</Form>
</template>
);
assert.dom(".ace_text-input").hasAttribute("readonly");
});

View File

@ -13,13 +13,15 @@ module(
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer />
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: null });
assert.form().field("foo").hasValue("");
@ -34,25 +36,29 @@ module(
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Composer />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Composer />
</form.Field>
</Form>
</template>
);
assert.dom(".d-editor-input").hasAttribute("disabled");
});
test("@height", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer @height={{42}} />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer @height={{42}} />
</form.Field>
</Form>
</template>
);
assert
.dom(".form-kit__control-composer")
@ -60,23 +66,27 @@ module(
});
test("@preview", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-composer.--preview").doesNotExist();
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer @preview={{true}} />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Composer @preview={{true}} />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-composer.--preview").exists();
});

View File

@ -9,15 +9,17 @@ module(
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @description="Bar" as |field|>
<field.Custom>
<input class="custom-test" />
</field.Custom>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @description="Bar" as |field|>
<field.Custom>
<input class="custom-test" />
</field.Custom>
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__container-title").hasText("Foo (optional)");
assert.dom(".form-kit__container-description").hasText("Bar");

View File

@ -18,13 +18,15 @@ module("Integration | Component | FormKit | Controls | Icon", function (hooks) {
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Icon />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Icon />
</form.Field>
</Form>
</template>
);
await formKit().field("foo").select("pencil");
await formKit().submit();
@ -34,13 +36,15 @@ module("Integration | Component | FormKit | Controls | Icon", function (hooks) {
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Icon />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Icon />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-icon.is-disabled").exists();
});

View File

@ -34,13 +34,15 @@ module(
test("default", async function (assert) {
let data = { image_url: "/images/discourse-logo-sketch-small.png" };
await render(<template>
<Form @data={{data}} as |form|>
<form.Field @name="image_url" @title="Foo" as |field|>
<field.Image @type="site_setting" />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @data={{data}} as |form|>
<form.Field @name="image_url" @title="Foo" as |field|>
<field.Image @type="site_setting" />
</form.Field>
</Form>
</template>
);
await formKit().submit();
@ -50,15 +52,20 @@ module(
test("removing the upload", async function (assert) {
let data = { image_url: "/images/discourse-logo-sketch-small.png" };
await render(<template>
<Form @data={{data}} as |form|>
<form.Field @name="image_url" @title="Foo" as |field|>
<field.Image @type="site_setting" />
</form.Field>
await render(
<template>
<Form @data={{data}} as |form|>
<form.Field @name="image_url" @title="Foo" as |field|>
<field.Image @type="site_setting" />
</form.Field>
<form.Button class="test" @action={{fn form.set "image_url" null}} />
</Form>
</template>);
<form.Button
class="test"
@action={{fn form.set "image_url" null}}
/>
</Form>
</template>
);
await formKit().submit();
@ -72,18 +79,20 @@ module(
test("when disabled", async function (assert) {
const data = { image_url: "/images/discourse-logo-sketch-small.png" };
await render(<template>
<Form @data={{data}} as |form|>
<form.Field
@name="image_url"
@title="Foo"
@disabled={{true}}
as |field|
>
<field.Image @type="site_setting" />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @data={{data}} as |form|>
<form.Field
@name="image_url"
@title="Foo"
@disabled={{true}}
as |field|
>
<field.Image @type="site_setting" />
</form.Field>
</Form>
</template>
);
assert.dom(".image-upload-controls input[type='file']").isDisabled();
assert.dom(".image-upload-controls .btn-danger").isDisabled();

View File

@ -13,13 +13,15 @@ module(
let data = { foo: "" };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Input @type="number" />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Input @type="number" />
</form.Field>
</Form>
</template>
);
assert.form().field("foo").hasValue("");
@ -33,18 +35,20 @@ module(
});
test("validation of required", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Input @type="number" />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Input @type="number" />
</form.Field>
</Form>
</template>
);
await formKit().submit();

View File

@ -13,13 +13,15 @@ module(
let data = { foo: "" };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Input />
</form.Field>
</Form>
</template>
);
assert.form().field("foo").hasValue("");
@ -33,13 +35,15 @@ module(
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-input").hasAttribute("disabled");
});

View File

@ -11,17 +11,19 @@ module("Integration | Component | FormKit | Controls | Menu", function (hooks) {
let data = { foo: "item-2" };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Menu as |menu|>
<menu.Item @value="item-1">Item 1</menu.Item>
<menu.Item @value="item-2">Item 2</menu.Item>
<menu.Item @value="item-3">Item 3</menu.Item>
</field.Menu>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Menu as |menu|>
<menu.Item @value="item-1">Item 1</menu.Item>
<menu.Item @value="item-2">Item 2</menu.Item>
<menu.Item @value="item-3">Item 3</menu.Item>
</field.Menu>
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: "item-2" });
assert.form().field("foo").hasValue("item-2");
@ -34,13 +36,15 @@ module("Integration | Component | FormKit | Controls | Menu", function (hooks) {
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Menu />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Menu />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-menu-trigger").hasAttribute("disabled");
});

View File

@ -13,13 +13,15 @@ module(
let data = { foo: "" };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Password />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Password />
</form.Field>
</Form>
</template>
);
assert.form().field("foo").hasValue("");
@ -35,13 +37,15 @@ module(
test("toggle visibility", async function (assert) {
let data = { foo: "test" };
await render(<template>
<Form @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Password />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Password />
</form.Field>
</Form>
</template>
);
assert
.dom(formKit().field("foo").element.querySelector("input"))

View File

@ -13,13 +13,15 @@ module(
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Question />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Question />
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: null });
assert.form().field("foo").hasValue(false);
@ -34,25 +36,29 @@ module(
});
test("@yesLabel", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Question @yesLabel="Correct" />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Question @yesLabel="Correct" />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-radio-label.--yes").hasText("Correct");
});
test("@noLabel", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Question @noLabel="Wrong" />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Question @noLabel="Wrong" />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-radio-label.--no").hasText("Wrong");
});

View File

@ -13,17 +13,19 @@ module(
let data = { foo: "one" };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one">One</RadioGroup.Radio>
<RadioGroup.Radio @value="two">Two</RadioGroup.Radio>
<RadioGroup.Radio @value="three">Three</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one">One</RadioGroup.Radio>
<RadioGroup.Radio @value="two">Two</RadioGroup.Radio>
<RadioGroup.Radio @value="three">Three</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>
);
assert.form().field("foo").hasValue("one");

View File

@ -9,32 +9,36 @@ module(
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one">One</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one">One</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-radio-content").hasText("One");
});
test("title/description", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one" as |radio|>
<radio.Title>One title</radio.Title>
<radio.Description>One description</radio.Description>
</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one" as |radio|>
<radio.Title>One title</radio.Title>
<radio.Description>One description</radio.Description>
</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-radio-title").hasText("One title");
assert
@ -43,17 +47,19 @@ module(
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one" as |radio|>
<radio.Title>One title</radio.Title>
</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.RadioGroup as |RadioGroup|>
<RadioGroup.Radio @value="one" as |radio|>
<radio.Title>One title</radio.Title>
</RadioGroup.Radio>
</field.RadioGroup>
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-radio").hasAttribute("disabled");
});

View File

@ -15,17 +15,19 @@ module(
let data = { foo: "option-2" };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select as |select|>
<select.Option @value="option-1">Option 1</select.Option>
<select.Option @value="option-2">Option 2</select.Option>
<select.Option @value="option-3">Option 3</select.Option>
</field.Select>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select as |select|>
<select.Option @value="option-1">Option 1</select.Option>
<select.Option @value="option-2">Option 2</select.Option>
<select.Option @value="option-3">Option 3</select.Option>
</field.Select>
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: "option-2" });
assert.form().field("foo").hasValue("option-2");
@ -40,50 +42,56 @@ module(
});
test("@disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Select as |select|>
<select.Option @value="option-1">Option 1</select.Option>
</field.Select>
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Select as |select|>
<select.Option @value="option-1">Option 1</select.Option>
</field.Select>
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-select").hasAttribute("disabled");
});
test("include none", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Select />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Select />
</form.Field>
</Form>
</template>
);
assert
.form()
.field("foo")
.hasValue(NO_VALUE_OPTION, "it has the none when no value is present");
await render(<template>
<Form @data={{hash foo="1"}} as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Select />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo="1"}} as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Select />
</form.Field>
</Form>
</template>
);
assert
.form()
@ -93,13 +101,15 @@ module(
"it doesn’t have the none when value is present"
);
await render(<template>
<Form @data={{hash foo="1"}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo="1"}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select />
</form.Field>
</Form>
</template>
);
assert
.form()
@ -109,13 +119,15 @@ module(
"it has the none when value is present and field is not required"
);
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select />
</form.Field>
</Form>
</template>
);
assert
.form()
@ -125,13 +137,15 @@ module(
"it has the none when no value is present and field is not required"
);
await render(<template>
<Form @data={{hash foo="1"}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select @includeNone={{false}} />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo="1"}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Select @includeNone={{false}} />
</form.Field>
</Form>
</template>
);
assert
.form()

View File

@ -13,13 +13,15 @@ module(
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Textarea />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Textarea />
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: null });
assert.form().field("foo").hasValue("");
@ -34,13 +36,15 @@ module(
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Textarea />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Textarea />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-textarea").hasAttribute("disabled");
});

View File

@ -13,13 +13,15 @@ module(
let data = { foo: null };
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Toggle />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Toggle />
</form.Field>
</Form>
</template>
);
assert.deepEqual(data, { foo: null });
assert.form().field("foo").hasValue(false);
@ -42,13 +44,15 @@ module(
});
test("when disabled", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Toggle />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @disabled={{true}} as |field|>
<field.Toggle />
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__control-toggle").hasAttribute("disabled");
});

View File

@ -26,32 +26,36 @@ module("Integration | Component | FormKit | Field", function (hooks) {
});
test("@size", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @size={{8}}>
Test
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @size={{8}}>
Test
</form.Field>
</Form>
</template>
);
assert.dom(".form-kit__row .form-kit__col.--col-8").hasText("Test");
});
test("@disabled", async function (assert) {
await render(<template>
<Form @data={{hash disabled=true}} as |form data|>
<form.Field
@name="foo"
@title="Foo"
@disabled={{data.disabled}}
as |field|
>
<field.Input />
</form.Field>
await render(
<template>
<Form @data={{hash disabled=true}} as |form data|>
<form.Field
@name="foo"
@title="Foo"
@disabled={{data.disabled}}
as |field|
>
<field.Input />
</form.Field>
<form.Button class="test" @action={{fn form.set "disabled" false}} />
</Form>
</template>);
<form.Button class="test" @action={{fn form.set "disabled" false}} />
</Form>
</template>
);
assert
.dom("#control-foo.is-disabled[data-disabled]")
@ -65,13 +69,20 @@ module("Integration | Component | FormKit | Field", function (hooks) {
});
test("@description", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @description="foo foo" as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@description="foo foo"
as |field|
>
<field.Input />
</form.Field>
</Form>
</template>
);
assert.form().field("foo").hasDescription("foo foo");
});
@ -81,13 +92,15 @@ module("Integration | Component | FormKit | Field", function (hooks) {
assert.deepEqual(error.message, "@name can't include `.` or `-`.");
});
await render(<template>
<Form as |form|>
<form.Field @name="foo.bar" @title="Foo" @size={{8}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo.bar" @title="Foo" @size={{8}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>
);
resetOnerror();
});
@ -100,28 +113,42 @@ module("Integration | Component | FormKit | Field", function (hooks) {
);
});
await render(<template>
<Form as |form|>
<form.Field @name="foo" @size={{8}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @size={{8}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>
);
resetOnerror();
});
test("@validation", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @validation="required" as |field|>
<field.Input />
</form.Field>
<form.Field @name="bar" @title="Bar" @validation="required" as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Input />
</form.Field>
<form.Field
@name="bar"
@title="Bar"
@validation="required"
as |field|
>
<field.Input />
</form.Field>
</Form>
</template>
);
await formKit().submit();
@ -143,15 +170,22 @@ module("Integration | Component | FormKit | Field", function (hooks) {
addError("foo", { title: "Some error", message: "error" });
};
await render(<template>
<Form @data={{hash foo="bar"}} as |form|>
<form.Field @name="foo" @title="Foo" @validate={{validate}} as |field|>
<field.Input />
</form.Field>
await render(
<template>
<Form @data={{hash foo="bar"}} as |form|>
<form.Field
@name="foo"
@title="Foo"
@validate={{validate}}
as |field|
>
<field.Input />
</form.Field>
<form.Submit />
</Form>
</template>);
<form.Submit />
</Form>
</template>
);
await formKit().submit();
@ -162,32 +196,36 @@ module("Integration | Component | FormKit | Field", function (hooks) {
});
test("@showTitle", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@showTitle={{false}}
as |field|
><field.Input /></form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@showTitle={{false}}
as |field|
><field.Input /></form.Field>
</Form>
</template>
);
assert.dom(".form-kit__container-title").doesNotExist();
});
test("@format", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@description="foo description"
@format="full"
as |field|
><field.Input /></form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@description="foo description"
@format="full"
as |field|
><field.Input /></form.Field>
</Form>
</template>
);
assert
.dom(".form-kit__field.--full")
@ -201,18 +239,20 @@ module("Integration | Component | FormKit | Field", function (hooks) {
});
test("@descriptionFormat", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@description="foo description"
@format="full"
@descriptionFormat="large"
as |field|
><field.Input /></form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@description="foo description"
@format="full"
@descriptionFormat="large"
as |field|
><field.Input /></form.Field>
</Form>
</template>
);
assert
.dom(".form-kit__field.--full")
@ -223,17 +263,19 @@ module("Integration | Component | FormKit | Field", function (hooks) {
});
test("@titleFormat", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@format="full"
@titleFormat="large"
as |field|
><field.Input /></form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@format="full"
@titleFormat="large"
as |field|
><field.Input /></form.Field>
</Form>
</template>
);
assert
.dom(".form-kit__field.--full")
@ -256,42 +298,48 @@ module("Integration | Component | FormKit | Field", function (hooks) {
onSetWasCalled();
};
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @onSet={{onSet}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @onSet={{onSet}} as |field|>
<field.Input />
</form.Field>
</Form>
</template>
);
await fillIn("input", "bar");
});
test("@tooltip", async function (assert) {
await render(<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @tooltip="text" as |field|>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field @name="foo" @title="Foo" @tooltip="text" as |field|>
<field.Input />
</form.Field>
</Form>
</template>
);
await click(".fk-d-tooltip__trigger");
assert.dom(".fk-d-tooltip__inner-content").hasText("text");
await render(<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@tooltip={{component DTooltip content="component"}}
as |field|
>
<field.Input />
</form.Field>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Field
@name="foo"
@title="Foo"
@tooltip={{component DTooltip content="component"}}
as |field|
>
<field.Input />
</form.Field>
</Form>
</template>
);
await click(".fk-d-tooltip__trigger");

View File

@ -13,27 +13,29 @@ module("Integration | Component | FormKit | Form", function (hooks) {
assert.deepEqual(data.foo, 1);
};
await render(<template>
<Form @data={{hash foo=1}} @onSubmit={{onSubmit}} />
</template>);
await render(
<template><Form @data={{hash foo=1}} @onSubmit={{onSubmit}} /></template>
);
await formKit().submit();
});
test("addItemToCollection", async function (assert) {
await render(<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Button
@action={{fn form.addItemToCollection "foo" (hash bar=3)}}
>Add</form.Button>
await render(
<template>
<Form @data={{hash foo=(array (hash bar=1) (hash bar=2))}} as |form|>
<form.Button
@action={{fn form.addItemToCollection "foo" (hash bar=3)}}
>Add</form.Button>
<form.Collection @name="foo" as |collection|>
<collection.Field @name="bar" @title="Bar" as |field|>
<field.Input />
</collection.Field>
</form.Collection>
</Form>
</template>);
<form.Collection @name="foo" as |collection|>
<collection.Field @name="bar" @title="Bar" as |field|>
<field.Input />
</collection.Field>
</form.Collection>
</Form>
</template>
);
await click("button");
@ -51,12 +53,14 @@ module("Integration | Component | FormKit | Form", function (hooks) {
addError("bar", { title: "Bar", message: "error" });
};
await render(<template>
<Form @data={{hash foo=1 bar=2}} @validate={{validate}} as |form|>
<form.Field @name="foo" @title="Foo" />
<form.Field @name="bar" @title="Bar" />
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=1 bar=2}} @validate={{validate}} as |form|>
<form.Field @name="foo" @title="Foo" />
<form.Field @name="bar" @title="Bar" />
</Form>
</template>
);
await formKit().submit();
@ -69,17 +73,29 @@ module("Integration | Component | FormKit | Form", function (hooks) {
test("@validateOn", async function (assert) {
const data = { foo: "test" };
await render(<template>
<Form @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" @validation="required" as |field|>
<field.Input />
</form.Field>
<form.Field @name="bar" @title="Bar" @validation="required" as |field|>
<field.Input />
</form.Field>
<form.Submit />
</Form>
</template>);
await render(
<template>
<Form @data={{data}} as |form|>
<form.Field
@name="foo"
@title="Foo"
@validation="required"
as |field|
>
<field.Input />
</form.Field>
<form.Field
@name="bar"
@title="Bar"
@validation="required"
as |field|
>
<field.Input />
</form.Field>
<form.Submit />
</Form>
</template>
);
await formKit().field("foo").fillIn("");
@ -116,16 +132,18 @@ module("Integration | Component | FormKit | Form", function (hooks) {
assert.deepEqual(model.foo, 1);
};
await render(<template>
<Form
@data={{model}}
@onSubmit={{submit}}
@onRegisterApi={{registerApi}}
as |form data|
>
<div class="bar">{{data.bar}}</div>
</Form>
</template>);
await render(
<template>
<Form
@data={{model}}
@onSubmit={{submit}}
@onRegisterApi={{registerApi}}
as |form data|
>
<div class="bar">{{data.bar}}</div>
</Form>
</template>
);
await formApi.set("bar", 2);
await formApi.submit();
@ -146,11 +164,13 @@ module("Integration | Component | FormKit | Form", function (hooks) {
});
test("@data", async function (assert) {
await render(<template>
<Form @data={{hash foo=1}} as |form data|>
<div class="foo">{{data.foo}}</div>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=1}} as |form data|>
<div class="foo">{{data.foo}}</div>
</Form>
</template>
);
assert.dom(".foo").hasText("1");
});
@ -165,17 +185,24 @@ module("Integration | Component | FormKit | Form", function (hooks) {
done();
};
await render(<template>
<Form @data={{hash bar=1}} @onReset={{onReset}} as |form|>
<form.Field @title="Foo" @name="foo" @validation="required" as |field|>
<field.Input />
</form.Field>
<form.Field @title="Bar" @name="bar" as |field|>
<field.Input />
</form.Field>
<form.Button class="set-bar" @action={{fn form.set "bar" 2}} />
</Form>
</template>);
await render(
<template>
<Form @data={{hash bar=1}} @onReset={{onReset}} as |form|>
<form.Field
@title="Foo"
@name="foo"
@validation="required"
as |field|
>
<field.Input />
</form.Field>
<form.Field @title="Bar" @name="bar" as |field|>
<field.Input />
</form.Field>
<form.Button class="set-bar" @action={{fn form.set "bar" 2}} />
</Form>
</template>
);
await click(".set-bar");
await formKit().field("foo").fillIn("");
@ -193,14 +220,16 @@ module("Integration | Component | FormKit | Form", function (hooks) {
test("immutable by default", async function (assert) {
const data = { foo: 1 };
await render(<template>
<Form @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Input />
</form.Field>
<form.Button class="set-foo" @action={{fn form.set "foo" 2}} />
</Form>
</template>);
await render(
<template>
<Form @data={{data}} as |form|>
<form.Field @name="foo" @title="Foo" as |field|>
<field.Input />
</form.Field>
<form.Button class="set-foo" @action={{fn form.set "foo" 2}} />
</Form>
</template>
);
await click(".set-foo");
@ -208,12 +237,14 @@ module("Integration | Component | FormKit | Form", function (hooks) {
});
test("yielded set", async function (assert) {
await render(<template>
<Form @data={{hash foo=1}} as |form data|>
<div class="foo">{{data.foo}}</div>
<form.Button class="test" @action={{fn form.set "foo" 2}} />
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=1}} as |form data|>
<div class="foo">{{data.foo}}</div>
<form.Button class="test" @action={{fn form.set "foo" 2}} />
</Form>
</template>
);
await click(".test");
@ -221,16 +252,18 @@ module("Integration | Component | FormKit | Form", function (hooks) {
});
test("yielded setProperties", async function (assert) {
await render(<template>
<Form @data={{hash foo=1 bar=1}} as |form data|>
<div class="foo">{{data.foo}}</div>
<div class="bar">{{data.bar}}</div>
<form.Button
class="test"
@action={{fn form.setProperties (hash foo=2 bar=2)}}
/>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=1 bar=1}} as |form data|>
<div class="foo">{{data.foo}}</div>
<div class="bar">{{data.bar}}</div>
<form.Button
class="test"
@action={{fn form.setProperties (hash foo=2 bar=2)}}
/>
</Form>
</template>
);
await click(".test");
@ -250,11 +283,13 @@ module("Integration | Component | FormKit | Form", function (hooks) {
}
};
await render(<template>
<Form @validate={{validate}} as |form|>
<form.Submit />
</Form>
</template>);
await render(
<template>
<Form @validate={{validate}} as |form|>
<form.Submit />
</Form>
</template>
);
await formKit().submit();
@ -266,25 +301,27 @@ module("Integration | Component | FormKit | Form", function (hooks) {
});
test("destroying field", async function (assert) {
await render(<template>
<Form @data={{hash visible=true}} as |form data|>
{{#if data.visible}}
<form.Field
@title="Foo"
@name="foo"
@validation="required"
as |field|
>
<field.Input />
</form.Field>
{{/if}}
await render(
<template>
<Form @data={{hash visible=true}} as |form data|>
{{#if data.visible}}
<form.Field
@title="Foo"
@name="foo"
@validation="required"
as |field|
>
<field.Input />
</form.Field>
{{/if}}
<form.Button
class="test"
@action={{fn form.setProperties (hash visible=false)}}
/>
</Form>
</template>);
<form.Button
class="test"
@action={{fn form.setProperties (hash visible=false)}}
/>
</Form>
</template>
);
await formKit().submit();

View File

@ -13,18 +13,20 @@ module(
let data = {};
const mutateData = (x) => (data = x);
await render(<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.InputGroup as |inputGroup|>
<inputGroup.Field @title="Foo" @name="foo" as |field|>
<field.Input />
</inputGroup.Field>
<inputGroup.Field @title="Bar" @name="bar" as |field|>
<field.Input />
</inputGroup.Field>
</form.InputGroup>
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{mutateData}} @data={{data}} as |form|>
<form.InputGroup as |inputGroup|>
<inputGroup.Field @title="Foo" @name="foo" as |field|>
<field.Input />
</inputGroup.Field>
<inputGroup.Field @title="Bar" @name="bar" as |field|>
<field.Input />
</inputGroup.Field>
</form.InputGroup>
</Form>
</template>
);
assert.form().field("foo").hasValue("");
assert.form().field("bar").hasValue("");

View File

@ -9,11 +9,13 @@ module(
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Actions class="something">Test</form.Actions>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Actions class="something">Test</form.Actions>
</Form>
</template>
);
assert
.dom(".form-kit__section.form-kit__actions.something")

View File

@ -7,21 +7,25 @@ module("Integration | Component | FormKit | Layout | Alert", function (hooks) {
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Alert>Test</form.Alert>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Alert>Test</form.Alert>
</Form>
</template>
);
assert.dom(".form-kit__alert-message").hasText("Test");
});
test("@icon", async function (assert) {
await render(<template>
<Form as |form|>
<form.Alert @icon="pencil">Test</form.Alert>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Alert @icon="pencil">Test</form.Alert>
</Form>
</template>
);
assert.dom(".form-kit__alert .d-icon-pencil").exists();
});
@ -31,11 +35,13 @@ module("Integration | Component | FormKit | Layout | Alert", function (hooks) {
for (let i = 0, length = types.length; i < length; i++) {
const type = types[i];
await render(<template>
<Form as |form|>
<form.Alert @type={{type}}>Test</form.Alert>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Alert @type={{type}}>Test</form.Alert>
</Form>
</template>
);
assert.dom(`.form-kit__alert.alert.alert-${type}`).exists();
}

View File

@ -14,11 +14,13 @@ module("Integration | Component | FormKit | Layout | Button", function (hooks) {
done();
};
await render(<template>
<Form as |form|>
<form.Button class="something" @action={{fn somethingAction 1}} />
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Button class="something" @action={{fn somethingAction 1}} />
</Form>
</template>
);
await click(".something");
});

View File

@ -9,18 +9,20 @@ module(
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.CheckboxGroup as |checkboxGroup|>
<checkboxGroup.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</checkboxGroup.Field>
<checkboxGroup.Field @name="bar" @title="Bar" as |field|>
<field.Checkbox>A description</field.Checkbox>
</checkboxGroup.Field>
</form.CheckboxGroup>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.CheckboxGroup as |checkboxGroup|>
<checkboxGroup.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</checkboxGroup.Field>
<checkboxGroup.Field @name="bar" @title="Bar" as |field|>
<field.Checkbox>A description</field.Checkbox>
</checkboxGroup.Field>
</form.CheckboxGroup>
</Form>
</template>
);
assert.form().field("foo").hasTitle("Foo (optional)");
assert.form().field("bar").hasTitle("Bar (optional)");
@ -28,15 +30,17 @@ module(
});
test("@title", async function (assert) {
await render(<template>
<Form as |form|>
<form.CheckboxGroup @title="bar" as |checkboxGroup|>
<checkboxGroup.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</checkboxGroup.Field>
</form.CheckboxGroup>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.CheckboxGroup @title="bar" as |checkboxGroup|>
<checkboxGroup.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</checkboxGroup.Field>
</form.CheckboxGroup>
</Form>
</template>
);
assert
.dom(".form-kit__checkbox-group .form-kit__fieldset-title")
@ -44,15 +48,17 @@ module(
});
test("@description", async function (assert) {
await render(<template>
<Form as |form|>
<form.CheckboxGroup @description="bar" as |checkboxGroup|>
<checkboxGroup.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</checkboxGroup.Field>
</form.CheckboxGroup>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.CheckboxGroup @description="bar" as |checkboxGroup|>
<checkboxGroup.Field @name="foo" @title="Foo" as |field|>
<field.Checkbox />
</checkboxGroup.Field>
</form.CheckboxGroup>
</Form>
</template>
);
assert
.dom(".form-kit__checkbox-group .form-kit__fieldset-description")

View File

@ -9,11 +9,13 @@ module(
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Container class="something">Test</form.Container>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Container class="something">Test</form.Container>
</Form>
</template>
);
assert
.dom(".form-kit__container.something .form-kit__container-content")
@ -21,11 +23,13 @@ module(
});
test("@title", async function (assert) {
await render(<template>
<Form as |form|>
<form.Container @title="Title">Test</form.Container>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Container @title="Title">Test</form.Container>
</Form>
</template>
);
assert
.dom(".form-kit__container .form-kit__container-title")
@ -33,11 +37,13 @@ module(
});
test("@subtitle", async function (assert) {
await render(<template>
<Form as |form|>
<form.Container @subtitle="Subtitle">Test</form.Container>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Container @subtitle="Subtitle">Test</form.Container>
</Form>
</template>
);
assert
.dom(".form-kit__container .form-kit__container-subtitle")

View File

@ -9,17 +9,19 @@ module(
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Fieldset
@title="Title"
@description="Description"
@name="a-fieldset"
>
Yielded content
</form.Fieldset>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Fieldset
@title="Title"
@description="Description"
@name="a-fieldset"
>
Yielded content
</form.Fieldset>
</Form>
</template>
);
assert
.form()

View File

@ -7,25 +7,29 @@ module("Integration | Component | FormKit | Layout | Row", function (hooks) {
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Row as |row|>
<row.Col>Test</row.Col>
</form.Row>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Row as |row|>
<row.Col>Test</row.Col>
</form.Row>
</Form>
</template>
);
assert.dom(".form-kit__row .form-kit__col").hasText("Test");
});
test("@size", async function (assert) {
await render(<template>
<Form as |form|>
<form.Row as |row|>
<row.Col @size={{6}}>Test</row.Col>
</form.Row>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Row as |row|>
<row.Col @size={{6}}>Test</row.Col>
</form.Row>
</Form>
</template>
);
assert.dom(".form-kit__row .form-kit__col.--col-6").hasText("Test");
});

View File

@ -9,21 +9,25 @@ module(
setupRenderingTest(hooks);
test("default", async function (assert) {
await render(<template>
<Form as |form|>
<form.Section class="something">Test</form.Section>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Section class="something">Test</form.Section>
</Form>
</template>
);
assert.dom(".form-kit__section.something").hasText("Test");
});
test("@title", async function (assert) {
await render(<template>
<Form as |form|>
<form.Section @title="Title">Test</form.Section>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Section @title="Title">Test</form.Section>
</Form>
</template>
);
assert
.dom(".form-kit__section .form-kit__section-title")
@ -31,11 +35,13 @@ module(
});
test("@subtitle", async function (assert) {
await render(<template>
<Form as |form|>
<form.Section @subtitle="Subtitle">Test</form.Section>
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Section @subtitle="Subtitle">Test</form.Section>
</Form>
</template>
);
assert
.dom(".form-kit__section .form-kit__section-subtitle")

View File

@ -15,11 +15,13 @@ module("Integration | Component | FormKit | Layout | Submit", function (hooks) {
done();
};
await render(<template>
<Form @onSubmit={{submit}} as |form|>
<form.Submit />
</Form>
</template>);
await render(
<template>
<Form @onSubmit={{submit}} as |form|>
<form.Submit />
</Form>
</template>
);
await click("button");
@ -28,11 +30,13 @@ module("Integration | Component | FormKit | Layout | Submit", function (hooks) {
});
test("@label", async function (assert) {
await render(<template>
<Form as |form|>
<form.Submit @label="cancel" />
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Submit @label="cancel" />
</Form>
</template>
);
assert
.dom(".form-kit__button")
@ -40,11 +44,13 @@ module("Integration | Component | FormKit | Layout | Submit", function (hooks) {
});
test("@isLoading", async function (assert) {
await render(<template>
<Form as |form|>
<form.Submit @label="cancel" @isLoading={{true}} />
</Form>
</template>);
await render(
<template>
<Form as |form|>
<form.Submit @label="cancel" @isLoading={{true}} />
</Form>
</template>
);
assert.dom(".form-kit__button .d-icon-spinner").exists();
});

View File

@ -9,37 +9,41 @@ module("Integration | Component | FormKit | Object", function (hooks) {
setupRenderingTest(hooks);
test("field", async function (assert) {
await render(<template>
<Form @data={{hash foo=(hash bar=1 baz=2)}} as |form|>
<form.Object @name="foo" as |object name|>
<object.Field @name={{name}} @title={{name}} as |field|>
<field.Input />
</object.Field>
</form.Object>
</Form>
</template>);
await render(
<template>
<Form @data={{hash foo=(hash bar=1 baz=2)}} as |form|>
<form.Object @name="foo" as |object name|>
<object.Field @name={{name}} @title={{name}} as |field|>
<field.Input />
</object.Field>
</form.Object>
</Form>
</template>
);
assert.form().field("foo.bar").hasValue("1");
assert.form().field("foo.baz").hasValue("2");
});
test("nested object", async function (assert) {
await render(<template>
<Form
@data={{hash one=(hash two=(hash three=(hash foo=1 bar=2)))}}
as |form|
>
<form.Object @name="one" as |one|>
<one.Object @name="two" as |two|>
<two.Object @name="three" as |three name|>
<three.Field @name={{name}} @title={{name}} as |field|>
<field.Input />
</three.Field>
</two.Object>
</one.Object>
</form.Object>
</Form>
</template>);
await render(
<template>
<Form
@data={{hash one=(hash two=(hash three=(hash foo=1 bar=2)))}}
as |form|
>
<form.Object @name="one" as |one|>
<one.Object @name="two" as |two|>
<two.Object @name="three" as |three name|>
<three.Field @name={{name}} @title={{name}} as |field|>
<field.Input />
</three.Field>
</two.Object>
</one.Object>
</form.Object>
</Form>
</template>
);
assert.form().field("one.two.three.foo").hasValue("1");
assert.form().field("one.two.three.bar").hasValue("2");
@ -50,24 +54,26 @@ module("Integration | Component | FormKit | Object", function (hooks) {
});
test("nested collection", async function (assert) {
await render(<template>
<Form
@data={{hash one=(hash two=(array (hash foo=1) (hash foo=2)))}}
as |form|
>
<form.Object @name="one" as |one|>
<one.Collection @name="two" as |two twoIndex|>
<two.Field @name="foo" @title="foo" as |field|>
<field.Input />
</two.Field>
<form.Button
class={{concat "remove-" twoIndex}}
@action={{fn two.remove twoIndex}}
>Remove</form.Button>
</one.Collection>
</form.Object>
</Form>
</template>);
await render(
<template>
<Form
@data={{hash one=(hash two=(array (hash foo=1) (hash foo=2)))}}
as |form|
>
<form.Object @name="one" as |one|>
<one.Collection @name="two" as |two twoIndex|>
<two.Field @name="foo" @title="foo" as |field|>
<field.Input />
</two.Field>
<form.Button
class={{concat "remove-" twoIndex}}
@action={{fn two.remove twoIndex}}
>Remove</form.Button>
</one.Collection>
</form.Object>
</Form>
</template>
);
assert.form().field("one.two.0.foo").hasValue("1");
assert.form().field("one.two.1.foo").hasValue("2");

View File

@ -8,9 +8,11 @@ module("Integration | Component | highlighted-code", function (hooks) {
setupRenderingTest(hooks);
test("highlighting code", async function (assert) {
await render(<template>
<HighlightedCode @lang="ruby" @code="def test; end" />
</template>);
await render(
<template>
<HighlightedCode @lang="ruby" @code="def test; end" />
</template>
);
assert.dom("code.lang-ruby.hljs .hljs-keyword").hasText("def");
});
@ -18,17 +20,21 @@ module("Integration | Component | highlighted-code", function (hooks) {
test("large code blocks are not highlighted", async function (assert) {
const longCodeBlock = "puts a\n".repeat(15000);
await render(<template>
<HighlightedCode @lang="ruby" @code={{longCodeBlock}} />
</template>);
await render(
<template>
<HighlightedCode @lang="ruby" @code={{longCodeBlock}} />
</template>
);
assert.dom("pre code").hasText(longCodeBlock);
});
test("highlighting code with lang=auto", async function (assert) {
await render(<template>
<HighlightedCode @lang="auto" @code="def test; end" />
</template>);
await render(
<template>
<HighlightedCode @lang="auto" @code="def test; end" />
</template>
);
assert.dom("code.hljs").hasNoClass("lang-auto", "lang-auto is removed");
assert.dom("code.hljs").hasClass(/language-/, "language is detected");
@ -48,10 +54,12 @@ module("Integration | Component | highlighted-code", function (hooks) {
const testState = new State();
await render(<template>
<HighlightedCode @lang="ruby" @code={{testState.code}} />
{{testState.code}}
</template>);
await render(
<template>
<HighlightedCode @lang="ruby" @code={{testState.code}} />
{{testState.code}}
</template>
);
assert.dom("code.lang-ruby.hljs .hljs-title").hasText("foo");

View File

@ -23,10 +23,12 @@ module("Integration | Component | latest-topic-list-item", function (hooks) {
const store = this.owner.lookup("service:store");
const topic = store.createRecord("topic", { id: 1234, foo: true });
const topic2 = store.createRecord("topic", { id: 1235, foo: false });
await render(<template>
<LatestTopicListItem @topic={{topic}} />
<LatestTopicListItem @topic={{topic2}} />
</template>);
await render(
<template>
<LatestTopicListItem @topic={{topic}} />
<LatestTopicListItem @topic={{topic2}} />
</template>
);
assert.dom(".latest-topic-list-item[data-topic-id='1234']").hasClass("bar");
assert

View File

@ -45,9 +45,11 @@ module("Integration | Component | light-dark-img", function (hooks) {
this.session.set("defaultColorSchemeIsDark", false);
this.session.set("darkModeAvailable", false);
await render(<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>);
await render(
<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>
);
assert.dom("picture").doesNotExist("there is no picture tag");
assert.dom("img").exists("there is an img tag");
@ -86,9 +88,11 @@ module("Integration | Component | light-dark-img", function (hooks) {
this.session.set("defaultColorSchemeIsDark", false);
this.session.set("darkModeAvailable", true);
await render(<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>);
await render(
<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>
);
assert.dom("picture").exists("there is a picture tag");
assert.dom("img").exists("there is an img tag");
@ -134,9 +138,11 @@ module("Integration | Component | light-dark-img", function (hooks) {
this.session.set("defaultColorSchemeIsDark", true);
this.session.set("darkModeAvailable", false);
await render(<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>);
await render(
<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>
);
assert.dom("picture").exists("there is a picture tag");
assert.dom("img").exists("there is an img tag");
@ -182,9 +188,11 @@ module("Integration | Component | light-dark-img", function (hooks) {
this.session.set("defaultColorSchemeIsDark", true);
this.session.set("darkModeAvailable", true);
await render(<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>);
await render(
<template>
<LightDarkImg @lightImg={{lightSrc}} @darkImg={{darkSrc}} />
</template>
);
assert.dom("picture").exists("there is a picture tag");
assert.dom("img").exists("there is an img tag");

Some files were not shown because too many files have changed in this diff Show More