-
Notifications
You must be signed in to change notification settings - Fork 6.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(datepicker): allow disabling calendar popup #5305
Merged
Merged
Changes from all commits
Commits
Show all changes
9 commits
Select commit
Hold shift + click to select a range
dc3d1e9
Add ability to disable datepicker pop-up in read-only mode.
jwshinjwshin 9ea8f44
Change readOnly to disabled
jwshinjwshin 4144d0b
Added ability to disable datepicker toggle when the input is disabled.
jwshinjwshin a635e06
Lint edits
jwshinjwshin ee5cd3d
Failed test fixes
jwshinjwshin dba15fb
Allow disabled input to disable popup unless specified otherwise for
jwshinjwshin 984122d
Minor comment edits
jwshinjwshin e5b023c
Added host bindings and changed delegation logic.
jwshinjwshin aa00bcd
Added tests for cascade and removed async testing.
jwshinjwshin File filter
Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -75,16 +75,16 @@ describe('MdDatepicker', () => { | |
fixture.detectChanges(); | ||
})); | ||
|
||
it('open non-touch should open popup', async(() => { | ||
it('open non-touch should open popup', () => { | ||
expect(document.querySelector('.cdk-overlay-pane')).toBeNull(); | ||
|
||
testComponent.datepicker.open(); | ||
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('.cdk-overlay-pane')).not.toBeNull(); | ||
})); | ||
}); | ||
|
||
it('open touch should open dialog', async(() => { | ||
it('open touch should open dialog', () => { | ||
testComponent.touch = true; | ||
fixture.detectChanges(); | ||
|
||
|
@@ -94,9 +94,36 @@ describe('MdDatepicker', () => { | |
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('md-dialog-container')).not.toBeNull(); | ||
})); | ||
}); | ||
|
||
it('open in disabled mode should not open the calendar', () => { | ||
testComponent.disabled = true; | ||
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('.cdk-overlay-pane')).toBeNull(); | ||
expect(document.querySelector('md-dialog-container')).toBeNull(); | ||
|
||
testComponent.datepicker.open(); | ||
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('.cdk-overlay-pane')).toBeNull(); | ||
expect(document.querySelector('md-dialog-container')).toBeNull(); | ||
}); | ||
|
||
it('disabled datepicker input should open the calendar if datepicker is enabled', () => { | ||
testComponent.datepicker.disabled = false; | ||
testComponent.datepickerInput.disabled = true; | ||
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('.cdk-overlay-pane')).toBeNull(); | ||
|
||
it('close should close popup', async(() => { | ||
testComponent.datepicker.open(); | ||
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('.cdk-overlay-pane')).not.toBeNull(); | ||
}); | ||
|
||
it('close should close popup', () => { | ||
testComponent.datepicker.open(); | ||
fixture.detectChanges(); | ||
|
||
|
@@ -110,7 +137,7 @@ describe('MdDatepicker', () => { | |
fixture.whenStable().then(() => { | ||
expect(parseInt(getComputedStyle(popup).height as string)).toBe(0); | ||
}); | ||
})); | ||
}); | ||
|
||
it('should close the popup when pressing ESCAPE', () => { | ||
testComponent.datepicker.open(); | ||
|
@@ -129,7 +156,7 @@ describe('MdDatepicker', () => { | |
.toBe(true, 'Expected default ESCAPE action to be prevented.'); | ||
}); | ||
|
||
it('close should close dialog', async(() => { | ||
it('close should close dialog', () => { | ||
testComponent.touch = true; | ||
fixture.detectChanges(); | ||
|
||
|
@@ -144,9 +171,9 @@ describe('MdDatepicker', () => { | |
fixture.whenStable().then(() => { | ||
expect(document.querySelector('md-dialog-container')).toBeNull(); | ||
}); | ||
})); | ||
}); | ||
|
||
it('setting selected should update input and close calendar', async(() => { | ||
it('setting selected should update input and close calendar', () => { | ||
testComponent.touch = true; | ||
fixture.detectChanges(); | ||
|
||
|
@@ -164,7 +191,7 @@ describe('MdDatepicker', () => { | |
expect(document.querySelector('md-dialog-container')).toBeNull(); | ||
expect(testComponent.datepickerInput.value).toEqual(new Date(2020, JAN, 2)); | ||
}); | ||
})); | ||
}); | ||
|
||
it('startAt should fallback to input value', () => { | ||
expect(testComponent.datepicker.startAt).toEqual(new Date(2020, JAN, 1)); | ||
|
@@ -443,6 +470,19 @@ describe('MdDatepicker', () => { | |
expect(document.querySelector('md-dialog-container')).not.toBeNull(); | ||
}); | ||
|
||
it('should not open calendar when toggle clicked if datepicker is disabled', () => { | ||
testComponent.datepicker.disabled = true; | ||
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('md-dialog-container')).toBeNull(); | ||
|
||
let toggle = fixture.debugElement.query(By.css('button')); | ||
dispatchMouseEvent(toggle.nativeElement, 'click'); | ||
fixture.detectChanges(); | ||
|
||
expect(document.querySelector('md-dialog-container')).toBeNull(); | ||
}); | ||
|
||
it('should set the `button` type on the trigger to prevent form submissions', () => { | ||
let toggle = fixture.debugElement.query(By.css('button')).nativeElement; | ||
expect(toggle.getAttribute('type')).toBe('button'); | ||
|
@@ -734,11 +774,12 @@ describe('MdDatepicker', () => { | |
@Component({ | ||
template: ` | ||
<input [mdDatepicker]="d" [value]="date"> | ||
<md-datepicker #d [touchUi]="touch"></md-datepicker> | ||
<md-datepicker #d [touchUi]="touch" [disabled]="disabled"></md-datepicker> | ||
There was a problem hiding this comment. Choose a reason for hiding this commentThe reason will be displayed to describe this comment to others. Learn more. should add tests for cascade as well |
||
`, | ||
}) | ||
class StandardDatepicker { | ||
touch = false; | ||
disabled = false; | ||
date = new Date(2020, JAN, 1); | ||
@ViewChild('d') datepicker: MdDatepicker<Date>; | ||
@ViewChild(MdDatepickerInput) datepickerInput: MdDatepickerInput<Date>; | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
you'll need to also add a host binding:
'[disabled]': 'disabled'
, to keep the native disabled attribute in sync with this