Implement Datepicker #183
Implement Datepicker #183
Conversation
| import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
|
||
| import { DatepickerComponent } from './datepicker.component'; | ||
|
|
There was a problem hiding this comment.
This file can be removed. Tests in demo app are not executed.
| }); | ||
| })); | ||
|
|
||
| describe('input-field', () => { |
There was a problem hiding this comment.
Used the same term used in mz-input-container, mz-select-container and mz-textarea-container spec files which wrap the .input-field class
| } | ||
|
|
||
| initElements() { | ||
| this.inputContainerElement = $(this.elementRef.nativeElement).parent('.input-field'); |
There was a problem hiding this comment.
Can we use native querySelector instead of jQuery in this case?
There was a problem hiding this comment.
Even if I would use querySelector other elements like inputElement needs to be a JQuery object to use the datepicker intialization method ... in other words we cannot get rid of JQuery anyway until Materialize completely removes it
|
|
||
| createLabelElement() { | ||
| const labelElement = document.createElement('label'); | ||
| labelElement.setAttribute('for', this.id); |
There was a problem hiding this comment.
Did you try to create a datepicker without date?
There was a problem hiding this comment.
Without date yes and if you meant without label ... the test you commented below covers it
|
|
||
| it('should be empty when omitted', async(() => { | ||
|
|
||
| buildComponent<any>(` |
There was a problem hiding this comment.
You can forget my previous comment about datepicker without label. This test is testing this use case.
There was a problem hiding this comment.
Alright ... you know you can delete comments right? 😉
| <mz-datepicker-container> | ||
| <input mz-datepicker | ||
| id="datepicker" | ||
| [disabled]="true"> |
There was a problem hiding this comment.
Should it use disabled instead of [disabled]="true" for this test?
There was a problem hiding this comment.
I added tests to validate both
| }).then((fixture) => { | ||
| component = fixture.componentInstance; | ||
| nativeElement = fixture.nativeElement; | ||
| fixture.detectChanges(); |
There was a problem hiding this comment.
You can use autoDetectChanges() function for your tests.
There was a problem hiding this comment.
I tried it but tests that uses tick() to force setTimeout executions do not work if I change it for autoDetectChanges() ... all the other tests only use one detectChanges() so it wouldn't change anything
| @@ -24,7 +26,7 @@ describe('MzInputDirective:unit', () => { | |||
|
|
|||
| beforeEach(() => { | |||
| renderer = TestBed.get(Renderer); | |||
| directive = new MzInputDirective(null, mockNgModel, mockElementRef, renderer); | |||
| directive = new MzInputDirective(mockNgModel, mockElementRef, renderer); | |||
Datepicker requested feature #170
✔️ Ready to be reviewed/merged