布莱
关于
Briee是一个图书库和UI组件的集合,意在所有brXM前端应用程序中使用,最终目标是建立连贯的用户体验.
详见 BRIE 简介 供参考.
核心捐助者
在本地应用程序中与 Brie 合作
在研究应用程序时,你可能会发现自己处于同样需要修改brie组件的境地。 有两种方法可以测试对图书馆所做的局部变化.
最简单的选项是修改组件,并通过现有的"故事集成"来测试. 这最适合测试组件API和其他基本相互作用.
测试变化的另一种方法是在使用时的上下文中直接测试该组件,例如作为现有FE应用的一部分. 这在框外是可能的,因为brie项目文件夹被映射到FE应用程序中的依赖性. 这是通过 莱娜 或雅尔克语.
构成部分发展做法
请在向图书馆投稿前阅读此节。 由于一致性、可读性和可维护性的原因,图书馆的任何增加都必须遵守这些做法.
发展做法
/ 有待完成
测试
在为库中的任何部分添加更改时,必须使其包含在测试中。 这些测试必须有意义,并在考虑到广泛覆盖范围的情况下加以发展。 由于其性质,其组成部分将被用于各种设想方案,因此,为了避免产生不可预测的结果,如此广泛的覆盖面至关重要.
作为拇指的通则,采用以下测试做法:
- 快照测试
- 优于单位测试的快照测试,因为它允许您减少写作花费的时间 通常大量的测试锅炉板代码
- 单位测试
- 没有整合测试
- 不测试相互相互作用的组件, 应在执行相互作用的应用程序中测试
测试应包括哪些内容?
- 各个有意义的国家最终构成部分的快照
- 构成部分类方法
- 如果一个方法有 单分支 通常它们已经被快照测试覆盖
- 同步事件
- 点击、徘徊、模糊等.
- 承诺
版本战略
/ 有待完成
窗体验证( 提交时验证)
BRIE 为 启用- on-change + 验证- 提交 模式。 所有API都是选入的;现有的消费者不受影响.
模板形式( 现有模式)
<form [formGroup]="group" brieShowErrorsOnSubmit [brieFocusFirstError]="true" (ngSubmit)="onSubmit()">
<brie-form [group]="group" [dataSource]="fields"></brie-form>
<button mat-flat-button type="submit">Save</button>
</form>
程序验证
弹出 BrieFormValidationService 从 @bloomreach/brie/form数字 :
save(): void {
const result = this.validationService.showValidationErrors(this.form, {
focusFirstError: true,
focusRoot: this.formElement.nativeElement,
});
if (!result.valid) {
return;
}
// proceed with save...
}
按钮选入( E)brie-button-group 编号 : brie-heading(中文(简体) )
{
id: 'button-save',
text: 'Save',
isDisabled: () => !this.form?.dirty,
validateBeforeAction: true,
validateForm: () => this.form,
validateFormOptions: { focusFirstError: true, focusRoot: this.formElement.nativeElement },
action: () => this.save(),
}
遗产模式isDisabled: () => this.form.invalid 无 validateBeforeAction)继续工作不变.
见故事集故事 遗留问题 财务报告和审定财务报表 行动前验证 组件/按钮组.
版权2022 布鲁斯通版权所有.