полностью абстраируясь от браузера

на NativeScript например

щас бы html тестить

то смысла нет писать тесты с рендерингом дома

т.к там ты будешь пытаться сделать user-form универсальным компонентом и под веб и под нативные моб платформы

it('should emit submit on valid form', fakeAsync(() => { const pass = 'valid_password_123456'; page.emailInput.value = 'valid_value@mail.ru'; page.passwordInput.value = pass; fixture.detectChanges(); tick(); expect(component.form.valid).toEqual(true); const saveSpy = spyOn(component.onFormSubmit, 'emit'); const btnInst: DxButtonComponent = page.submitBtn.componentInstance; btnInst.onClick.emit(); expect(saveSpy.calls.any()).toBe(true); })); Вот например, в таком духе тест годится на то чтобы претендовать на покрытие кейса о вызове евента если форма валидна?

и ниже скажем не валидное что то ввожу и expect что не вызвался emit, и все я покрыл логинилку считается?

это что ты протестировал? что ангуляр работает?

я бы еще проверил что там пришло в saveSpy

мы же ожидаем объект конкретного типа чтобы потом например в api отправить

Ну и это да

а так да, я разделяю такой подход к тестированию

@dersizes Бесполезный тест ?

вам видней, лул

да, еще при невалидном вводе можно проверить вывод ошибок/подсказок

если они есть

@dersizes Ну у меня в название кейса написано то что я тестирую, к любой критике открыт и даже рад если есть какие то поправки =)

https://github.com/angular/angular/blob/master/modules/%40angular/forms/test/validators_spec.ts

я к этому

вы щас во второй слой покрывыете тестами ангуляр

Да тоже такая мысль была, разве что целиком кейса нет что будет вызван emit, а лишь отдельных валидаторов, но с другой стороны expect(component.form.valid).toEqual(true); действительно очевидная

Да тоже такая мысль была, разве что целиком кейса нет что будет вызван emit, а лишь отдельных валидаторов, но с другой стороны expect(component.form.valid).toEqual(true); действительно очевидная

Да но если у тебя кастомный контрол - то не все таки очевидно

нет, это не так, я не предлагаю проверять инпуты отдельно или стандартные валидаторы типа required и expect(component.form.valid).toEqual(true) можно не проверять, у тебя есть какая-то форма <user-form> в ней может быть что угодно

коллеги, а можно как-то ngIf юзать с ngFor не использовав свою директиву?

кастомные контролы, как уже сказали, сложная логика (выбрал одно поле, появились еще другие)

и много чего еще

тебе нужно быть уверенным как работает <user-form> и проверить все use cases

тот же вывод ошибок валидации

Output-свойств тоже может быть больше, кейсы бывают разные

в общем нужно конечно видеть эту грань когда ты начинаешь тестировать сам фреймворк, это справедливое замечание

будете @Component @Input @Output покрывать?

то в какой момент твой компонент вызывает определенный Output и то что он туда отправляет это далеко за рамками angular

это твоя логика

кастомные контролы, как уже сказали, сложная логика (выбрал одно поле, появились еще другие)

Plz squash messages

и ты ее должен тестировать

https://angular.io/resources/live-examples/testing/ts/app-specs.eplnkr.html У них там пол тестов тогда покрывают работу самого ангуляра

коллеги, а можно как-то ngIf юзать с ngFor не использовав свою директиву?

плс

плс

ты иммешь ввиду ngIf и ngFor использовать на одной DOM ноде?

ну да

я хочу на каждую итерацию цикла проверять условие

не проще коллекцию отфилтровать?

согласен, комбинация ngFor и ngIf это фильтр внутри ngFor

ну да

Так запретили делать.. из за того что ngIf и ngFor это сентаксический сахар и в зависимости от ситуации было разное поведение. Как и сказали - выход это Pipe либо <template [ng-if]="showCategory()"> <div *ng-for="#category of categories"> Category: {{ category.displayName }} </div> </template>

спасибо

если присутствие элемента в доме не критично и подразумевается что по клику куда-либо этот элемент нужно будет показать то можно сделать <div *ngFor="..." [hidden]="!showCategory()">

коллеги, а можно как-то ngIf юзать с ngFor не использовав свою директиву?

<ng-container>

Я сделал <div ngFor> <component ngIf> </component> </div>

Я сделал <div ngFor> <component ngIf> </component> </div>

А вот так вот не будет лишних элементов: <ng-container *ngFor='foo'> <ng-container *ngIf='bar'> ... </ng-container> </ng-container>

<div *ngFor="let contact of contactLibrary"> <app-contact-block *ngIf="contacts.indexOf(contact.id) !== -1" [title]="contact.title" [contact_id]="contact.id" [mask]="" [(contactInput)]="contactInput" (contactOutput)="sendToGeneral($event)" ></app-contact-block> </div>

А вот так вот не будет лишних элементов: <ng-container *ngFor='foo'> <ng-container *ngIf='bar'> ... </ng-container> </ng-container>

не совсем понимаю как мне применить это к своему случаю

не совсем понимаю как мне применить это к своему случаю

Вот так можно <ng-container *ngFor="let contact of contactLibrary"> <app-contact-block *ngIf="contacts.indexOf(contact.id) !== -1" [title]="contact.title" [contact_id]="contact.id" [mask]="" [(contactInput)]="contactInput" (contactOutput)="sendToGeneral($event)" ></app-contact-block> </ng-container>

а в чем разница если не секрет?

аа понял

погуглил

спасибо за помощь

а в чем разница если не секрет?

ну если вас не волнует что у вас там лишний div, то нет разницы) div ведет себя как блочный элемент, а с ng-container там просто не будет лишнего ничего

ну если вас не волнует что у вас там лишний div, то нет разницы) div ведет себя как блочный элемент, а с ng-container там просто не будет лишнего ничего

template тоже никаких DOM элементов лишних не генерирует

Извините, а где вы вообще берете эти темплейт и ng-container? в оф доке они описаны?

ткните носом

template тоже никаких DOM элементов лишних не генерирует

ага, ну если вы помните синтаксис всех структурных директив и считаете, что сахарок не нужен, то так можно делать)

Извините, а где вы вообще берете эти темплейт и ng-container? в оф доке они описаны?

https://angular.io/docs/ts/latest/guide/template-syntax.html#!#star-template

ага, ну если вы помните синтаксис всех структурных директив и считаете, что сахарок не нужен, то так можно делать)

Не не спорю что ng-container удобнее.

спасибо

Извините, а где вы вообще берете эти темплейт и ng-container? в оф доке они описаны?

https://angular.io/docs/ts/latest/api/common/index/NgSwitch-directive.html

Гайз, привет, а есть ресурсы где по ангуляру и нэйтиву на русском можно почитать, с примерчиками желательно?

я этого не знал. благодарю еще раз

Гайз, привет, а есть ресурсы где по ангуляру и нэйтиву на русском можно почитать, с примерчиками желательно?

В https://telegram.me/nativescript_ru Недавно скидывали

Гайз, привет, а есть ресурсы где по ангуляру и нэйтиву на русском можно почитать, с примерчиками желательно?

https://tehnojam.pro/tag/nativescript/

В https://telegram.me/nativescript_ru Недавно скидывали

спасибо тупанул )) норм если еще что то подобное будет буду благодарен

https://tehnojam.pro/tag/nativescript/

ооо, вот то что нужно пасиб

Кто нибудт организовывал динамические формы? чтобы по модельки сразу построить можно было шаблонную форму?

да

Кто нибудт организовывал динамические формы? чтобы по модельки сразу построить можно было шаблонную форму?

в планах только))

мы формат json-schema.org используем

Кто нибудт организовывал динамические формы? чтобы по модельки сразу построить можно было шаблонную форму?

на рекакте по json-schema но хотели со схемы перелезть на json-ld

Это вы так покрывали кейс дублирования кода или именно динамические филды были в базе?

@bro_science @sedruid

в бэкенде они хранятся, да

из API получаешь схему, потом по ней строишь форму

динамические, схема объекта описывается тоже схемой и меняется пользователем,

Мне в админку бы просто, у меня на беке loopback генерирует SDK, этим бы воспользоваться

т.е готовую модельку на TS выдает, как то бы замапить ее на форму и все, они там однотипные, единственно там валидации наверное прокидывать геморно?

можно описать в схеме и валидацию,

мы для этого немного расширяли синтаксих схемы

https://github.com/udos86/ng2-dynamic-forms Вот тут у них готовые я вижу есть варианты для bootstrap итд, у меня комерч. devextreme для него мб реализовать интерфейсы какие, мб самому уж написать наподобие что то

самому конечно писать

там не сложно самому всё написать на каждый тип данных по компоненту, да дерева обход

интересно если сделать у такого объекта итератор по его обходу, то ng-for по идеи должен его обойти

Во идея кстати

ну все я вдохновлен, так и поступлю, единстенно что у меня там готовый TS interface беком раз выдается замаплюсь на typeof тогда наверное

расскажи потом о результатах, а то мне любопытно =)

Подскажите пожалуйста, как можно при ngSubmit, чтобы из формы бралось не только <input> {name: value} , но еще и какой -нибудь атрибут ?

Подскажите пожалуйста, как можно при ngSubmit, чтобы из формы бралось не только <input> {name: value} , но еще и какой -нибудь атрибут ?

<form #f="ngForm" (ngSubmit)="onSubmit(f.value)"> <div #other></div> onSubmit(form: any): void { form.OTHER_PROPERTY = this.other.nativeElement.nativeElement.getAttribute('attributename'); } Но я бы посоветовал вместо DIV или любого другово элемента создать компонент и у него создать свойство и из него заберать значение. В обход прямого обращения к DOM.

спасибо! просто в форме несколько инпутов, а мне нужно помимо значений из этих инпутов взять еще в связке название инпута на русском, которое отображается в span над этим инпутом.

понимаю что наверное глупый вопрос, нооо ... зачем вам значение из спана?)))