Skip to content

fix(form-field): FormField with outline doesn't work well with dir="r… #15415

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.

Sign up for GitHub

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

Merged
merged 46 commits into from
Sep 27, 2019
Merged

fix(form-field): FormField with outline doesn't work well with dir="r… #15415

Changes from 4 commits
Commits
Show all changes
46 commits
Select commit Hold shift + click to select a range
501b6be
fix(form-field): FormField with outline doesn't work well with dir="r…
Suresh918 Mar 7, 2019
2dd29e0
Revert "fix(form-field): FormField with outline doesn't work well wit…
Suresh918 Mar 15, 2019
0013ac5
Merge branch 'master' of https://github.com/angular/material2 into di…
Suresh918 Mar 15, 2019
1ca5bce
fix(form-field): FormField with outline doesn't work well with dir="r…
Suresh918 Mar 15, 2019
63ca947
chore(ivy): add static flag to tab-related static queries
kara Feb 20, 2019
ba98344
chore(ivy): add static flag to dialog-related static queries (#15239)
kara Feb 20, 2019
d06b0bf
chore(ivy): add static flag to more queries (#15252)
kara Feb 20, 2019
cbd527c
chore(ivy): add static flag to tree-related static queries (#15255)
kara Feb 20, 2019
a22cbbb
chore(ivy): add static flag to table-related static queries (#15257)
kara Feb 21, 2019
2df2af2
chore(ivy): fix static query stragglers that were not marked static q…
kara Feb 21, 2019
050af72
test(menu): refactor test that depends on static queries (#15289)
crisbeto Feb 25, 2019
4e61755
test(sidenav): fix sidenav failures under Ivy (#15300)
crisbeto Feb 25, 2019
6adbdb2
test(overlay): use static queries w/ overlay containers (#15301)
jelbourn Feb 26, 2019
77c13c8
test(select): update static query tests (#15320)
crisbeto Feb 26, 2019
864b238
test(accordion): update static query test (#15357)
marclaval Mar 1, 2019
4f08d26
fix: mark virtual scroll viewport queries as static (#15346)
kara Mar 1, 2019
6743041
fix(form-field): FormField with outline doesn't work well with dir="r…
Suresh918 Mar 7, 2019
4338173
refactor(button): use [attr.disabled] host binding in MatButton (#15308)
jelbourn Mar 8, 2019
705211b
fix(list): override native button text align in action list (#15404)
mitchellwills Mar 8, 2019
5bbbfe3
fix(badge): duplicate leftover badge after server-side render (#15417)
crisbeto Mar 8, 2019
0b47031
chore: bump version to 7.3.4 w/ changelog (#15439)
josephperrott Mar 11, 2019
b07f20c
fix(schematics): do not run migrations multiple times (#15424)
devversion Mar 11, 2019
364cb97
docs(drag-drop): add docs and live example for disabled sorting (#15426)
crisbeto Mar 11, 2019
04cfbb1
test(chip-list): rework tests to work under Ivy (#15428)
crisbeto Mar 11, 2019
25bf0c2
build: throw error if example is missing a title (#15430)
crisbeto Mar 11, 2019
b0a17a1
refactor(selection-list): avoid deprecated method (#15393)
swseverance Mar 11, 2019
0f9f706
test(table): update static query test (#15452)
marclaval Mar 12, 2019
71ef456
refactor(stepper): rework buttons to handle Ivy (#15429)
crisbeto Mar 12, 2019
401173f
fix(table): use default change detection strategy on table (#15440)
andrewseguin Mar 12, 2019
e62d5d6
test(input): make the type validation test to pass in Ivy (#15460)
marclaval Mar 13, 2019
81a5ebf
fix(stepper): avoid breaking change in stepControl type (#15464)
crisbeto Mar 13, 2019
71b3949
fix(tooltip): render style values in ngOnInit instead of the construc…
matsko Mar 14, 2019
f63e725
chore: update tooltip golden file (#15479)
crisbeto Mar 14, 2019
eca118f
refactor(datepicker): adapt custom header demo for Ivy (#15458)
marclaval Mar 14, 2019
c6a51e7
refactor(focus-monitor): adapt demo examples for Ivy (#15475)
marclaval Mar 14, 2019
f9936ed
fix(table): use static queries for examples (#15483)
andrewseguin Mar 15, 2019
fc66e95
fix(stepper): content not being rendered out initially with ivy (#15485)
crisbeto Mar 15, 2019
aa735dd
Revert "fix(form-field): FormField with outline doesn't work well wit…
Suresh918 Mar 15, 2019
30805cb
fix(form-field): FormField with outline doesn't work well with dir="r…
Suresh918 Mar 15, 2019
f767f05
Merge branch 'directionality-update' of https://github.com/Suresh918/…
Suresh918 Apr 15, 2019
f7973dd
fix(form-field): test cases added for form field outline styles w.r.t…
Suresh918 Apr 15, 2019
b2e25a8
fix(form-field): lint errors and test cases fixes
Suresh918 Apr 15, 2019
9746c91
fix(form-field): lint errors and test cases fixes
Suresh918 Apr 15, 2019
c68824f
fix(form-field): test cases changes and comments added
Suresh918 Apr 15, 2019
7de5c7f
fix(form-field): lint error fix
Suresh918 Apr 15, 2019
08a7c28
Merge remote-tracking branch 'upstream/master' into pr15415
mmalerba Jun 26, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 8 additions & 3 deletions src/lib/form-field/form-field.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
* found in the LICENSE file at https://angular.io/license
*/

import {Directionality} from '@angular/cdk/bidi';
import {Direction, Directionality} from '@angular/cdk/bidi';
import {coerceBooleanProperty} from '@angular/cdk/coercion';
import {
AfterContentChecked,
Expand Down Expand Up @@ -231,6 +231,8 @@ export class MatFormField extends _MatFormFieldMixinBase
/** Whether the Angular animations are enabled. */
_animationsEnabled: boolean;

private _previousDirection: Direction = 'ltr';

/**
* @deprecated
* @breaking-change 8.0.0
Expand Down Expand Up @@ -336,7 +338,10 @@ export class MatFormField extends _MatFormFieldMixinBase
});

if (this._dir) {
this._dir.change.pipe(takeUntil(this._destroyed)).subscribe(() => this.updateOutlineGap());
this._dir.change.pipe(takeUntil(this._destroyed)).subscribe(() => {
this.updateOutlineGap();
this._previousDirection = this._dir.value;
Copy link
Contributor

@mmalerba mmalerba Apr 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

why is the direction not updated until after calling updateOutlineGap?

Copy link
Contributor

@mmalerba mmalerba Apr 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh sorry I just read your explanation above, can you add a comment to the code. It looks wrong at first glance, without a note explaining it.

Copy link
Member

@crisbeto crisbeto Apr 8, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Even looking at the description on the PR, I'm not quite sure whether this will cover all the cases. The event will only if a new value is set. Also we probably need a unit test for this.

Copy link
Contributor Author

@Suresh918 Suresh918 Apr 15, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@crisbeto @mmalerba "gulp test" and "gulp serve:devapp" are not working in my local. Do I need to do any configuration changes? Can you help me in running test cases? Even I tried "karma run", that's also giving errors in the console.

Copy link
Contributor Author

@Suresh918 Suresh918 Apr 15, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

gulp test is working fine when i updated the node packages. But is there any way to run specific test suite ?

Copy link
Contributor Author

@Suresh918 Suresh918 Apr 15, 2019

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@crisbeto @mmalerba I added test cases and comments. Can you please review those.

});
}
}

Expand Down Expand Up @@ -558,7 +563,7 @@ export class MatFormField extends _MatFormFieldMixinBase

/** Gets the start end of the rect considering the current directionality. */
private _getStartEnd(rect: ClientRect): number {
return this._dir && this._dir.value === 'rtl' ? rect.right : rect.left;
return this._previousDirection === 'rtl' ? rect.right : rect.left;
}

/**
Expand Down