Skip to content
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

refactor(material/input): remove deprecated autosize directive #23408

Merged
merged 1 commit into from
Sep 13, 2021
Merged

refactor(material/input): remove deprecated autosize directive #23408

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
5 changes: 1 addition & 4 deletions scripts/check-mdc-tests-config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,10 +76,7 @@ export const config = {
'should update the outline gap correctly if the direction changes multiple times',
'should calculate the outline gaps inside the shadow DOM',
'should be legacy appearance if no default options provided',
'should be legacy appearance if empty default options provided',
'should adjust height due to long placeholders',
'should work in a tab',
'should work in a step'
'should be legacy appearance if empty default options provided'
],
'mdc-list': [
// TODO: these tests need to be double-checked for missing functionality.
Expand Down
29 changes: 0 additions & 29 deletions src/material-experimental/mdc-input/autosize.ts
View file
Open in desktop

This file was deleted.

5 changes: 2 additions & 3 deletions src/material-experimental/mdc-input/module.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,11 @@ import {TextFieldModule} from '@angular/cdk/text-field';
import {NgModule} from '@angular/core';
import {MatCommonModule} from '@angular/material-experimental/mdc-core';
import {MatFormFieldModule} from '@angular/material-experimental/mdc-form-field';
import {MatTextareaAutosize} from './autosize';
import {MatInput} from './input';

@NgModule({
imports: [MatCommonModule, MatFormFieldModule],
exports: [MatInput, MatTextareaAutosize, MatFormFieldModule, TextFieldModule, MatCommonModule],
declarations: [MatInput, MatTextareaAutosize],
exports: [MatInput, MatFormFieldModule, TextFieldModule, MatCommonModule],
declarations: [MatInput],
})
export class MatInputModule {}
1 change: 0 additions & 1 deletion src/material-experimental/mdc-input/public-api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@

export {MatInput} from './input';
export {MatInputModule} from './module';
export {MatTextareaAutosize} from './autosize';
export {
getMatInputUnsupportedTypeError,
MAT_INPUT_VALUE_ACCESSOR,
Expand Down
2 changes: 0 additions & 2 deletions src/material/input/BUILD.bazel
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,8 +50,6 @@ ng_test_library(
"//src/cdk/testing/private",
"//src/material/core",
"//src/material/form-field",
"//src/material/stepper",
"//src/material/tabs",
"@npm//@angular/forms",
"@npm//@angular/platform-browser",
"@npm//rxjs",
Expand Down
44 changes: 0 additions & 44 deletions src/material/input/autosize.ts
View file
Open in desktop

This file was deleted.

4 changes: 1 addition & 3 deletions src/material/input/input-module.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,11 +10,10 @@ import {TextFieldModule} from '@angular/cdk/text-field';
import {NgModule} from '@angular/core';
import {ErrorStateMatcher, MatCommonModule} from '@angular/material/core';
import {MatFormFieldModule} from '@angular/material/form-field';
import {MatTextareaAutosize} from './autosize';
import {MatInput} from './input';

@NgModule({
declarations: [MatInput, MatTextareaAutosize],
declarations: [MatInput],
imports: [
TextFieldModule,
MatFormFieldModule,
Expand All @@ -26,7 +25,6 @@ import {MatInput} from './input';
// be used together with `MatFormField`.
MatFormFieldModule,
MatInput,
MatTextareaAutosize,
],
providers: [ErrorStateMatcher],
})
Expand Down
92 changes: 0 additions & 92 deletions src/material/input/input.spec.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -43,12 +43,9 @@ import {
} from '@angular/material/form-field';
import {By} from '@angular/platform-browser';
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {MatStepperModule} from '@angular/material/stepper';
import {MatTabsModule} from '@angular/material/tabs';
import {Directionality, Direction} from '@angular/cdk/bidi';
import {Subject} from 'rxjs';
import {MatInputModule, MatInput, MAT_INPUT_VALUE_ACCESSOR} from './index';
import {MatTextareaAutosize} from './autosize';

describe('MatInput without forms', () => {
it('should default to floating labels', fakeAsync(() => {
Expand Down Expand Up @@ -1703,44 +1700,6 @@ describe('MatFormField default options', () => {

});

describe('MatInput with textarea autosize', () => {
it('should adjust height due to long placeholders', () => {
const fixture = createComponent(AutosizeTextareaWithLongPlaceholder);
fixture.detectChanges();

const textarea = fixture.nativeElement.querySelector('textarea');
const autosize = fixture.componentInstance.autosize;

autosize.resizeToFitContent(true);

const heightWithLongPlaceholder = textarea.clientHeight;

fixture.componentInstance.placeholder = 'Short';
fixture.detectChanges();

autosize.resizeToFitContent(true);

expect(textarea.clientHeight)
.withContext('Expected the textarea height to be shorter with a long placeholder.')
.toBeLessThan(heightWithLongPlaceholder);
});

it('should work in a tab', () => {
const fixture = createComponent(AutosizeTextareaInATab, [], [MatTabsModule]);
fixture.detectChanges();
const textarea = fixture.nativeElement.querySelector('textarea');
expect(textarea.getBoundingClientRect().height).toBeGreaterThan(1);
});

it('should work in a step', () => {
const fixture = createComponent(AutosizeTextareaInAStep, [], [MatStepperModule]);
fixture.detectChanges();
const textarea = fixture.nativeElement.querySelector('textarea');
expect(textarea.getBoundingClientRect().height).toBeGreaterThan(1);
});
});


function createComponent<T>(component: Type<T>,
providers: Provider[] = [],
imports: any[] = [],
Expand Down Expand Up @@ -2182,57 +2141,6 @@ class MatInputWithOutlineAppearanceInShadowDOM {
@ViewChild('formField', {read: ElementRef}) formField: ElementRef<HTMLElement>;
}


// Styles to reset padding and border to make measurement comparisons easier.
const textareaStyleReset = `
textarea {
padding: 0;
border: none;
overflow: auto;
}`;

@Component({
template: `
<mat-form-field style="width: 100px" appearance="fill">
<textarea matInput matTextareaAutosize [placeholder]="placeholder"></textarea>
</mat-form-field>`,
styles: [textareaStyleReset],
})
class AutosizeTextareaWithLongPlaceholder {
placeholder = 'Long Long Long Long Long Long Long Long Placeholder';
@ViewChild(MatTextareaAutosize) autosize: MatTextareaAutosize;
}

@Component({
template: `
<mat-tab-group>
<mat-tab label="Tab 1">
<mat-form-field>
<textarea matInput matTextareaAutosize>
Blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
</textarea>
</mat-form-field>
</mat-tab>
</mat-tab-group>
`
})
class AutosizeTextareaInATab {}

@Component({
template: `
<mat-stepper>
<mat-step label="Step 1">
<mat-form-field>
<textarea matInput matTextareaAautosize>
Blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah blah
</textarea>
</mat-form-field>
</mat-step>
</mat-stepper>
`
})
class AutosizeTextareaInAStep {}

@Component({
template: `
<mat-form-field>
Expand Down
1 change: 0 additions & 1 deletion src/material/input/public-api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@
* found in the LICENSE file at https://angular.io/license
*/

export * from './autosize';
export * from './input';
export * from './input-errors';
export * from './input-module';
Expand Down
29 changes: 4 additions & 25 deletions tools/public_api_guard/material/input.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,16 +9,15 @@ import { AfterViewInit } from '@angular/core';
import { AutofillMonitor } from '@angular/cdk/text-field';
import { BooleanInput } from '@angular/cdk/coercion';
import { CanUpdateErrorState } from '@angular/material/core';
import { CdkTextareaAutosize } from '@angular/cdk/text-field';
import { Constructor } from '@angular/material/core/common-behaviors/constructor';
import { DoCheck } from '@angular/core';
import { ElementRef } from '@angular/core';
import { ErrorStateMatcher } from '@angular/material/core';
import { FormGroupDirective } from '@angular/forms';
import * as i0 from '@angular/core';
import * as i3 from '@angular/cdk/text-field';
import * as i4 from '@angular/material/form-field';
import * as i5 from '@angular/material/core';
import * as i2 from '@angular/cdk/text-field';
import * as i3 from '@angular/material/form-field';
import * as i4 from '@angular/material/core';
import { InjectionToken } from '@angular/core';
import { MatFormField } from '@angular/material/form-field';
import { MatFormFieldControl } from '@angular/material/form-field';
Expand Down Expand Up @@ -123,27 +122,7 @@ export class MatInputModule {
// (undocumented)
static ɵinj: i0.ɵɵInjectorDeclaration<MatInputModule>;
// (undocumented)
static ɵmod: i0.ɵɵNgModuleDeclaration<MatInputModule, [typeof i1.MatInput, typeof i2.MatTextareaAutosize], [typeof i3.TextFieldModule, typeof i4.MatFormFieldModule, typeof i5.MatCommonModule], [typeof i3.TextFieldModule, typeof i4.MatFormFieldModule, typeof i1.MatInput, typeof i2.MatTextareaAutosize]>;
}

// @public @deprecated
export class MatTextareaAutosize extends CdkTextareaAutosize {
// (undocumented)
get matAutosize(): boolean;
set matAutosize(value: boolean);
// (undocumented)
get matAutosizeMaxRows(): number;
set matAutosizeMaxRows(value: number);
// (undocumented)
get matAutosizeMinRows(): number;
set matAutosizeMinRows(value: number);
// (undocumented)
get matTextareaAutosize(): boolean;
set matTextareaAutosize(value: boolean);
// (undocumented)
static ɵdir: i0.ɵɵDirectiveDeclaration<MatTextareaAutosize, "textarea[mat-autosize], textarea[matTextareaAutosize]", ["matTextareaAutosize"], { "cdkAutosizeMinRows": "cdkAutosizeMinRows"; "cdkAutosizeMaxRows": "cdkAutosizeMaxRows"; "matAutosizeMinRows": "matAutosizeMinRows"; "matAutosizeMaxRows": "matAutosizeMaxRows"; "matAutosize": "mat-autosize"; "matTextareaAutosize": "matTextareaAutosize"; }, {}, never>;
// (undocumented)
static ɵfac: i0.ɵɵFactoryDeclaration<MatTextareaAutosize, never>;
static ɵmod: i0.ɵɵNgModuleDeclaration<MatInputModule, [typeof i1.MatInput], [typeof i2.TextFieldModule, typeof i3.MatFormFieldModule, typeof i4.MatCommonModule], [typeof i2.TextFieldModule, typeof i3.MatFormFieldModule, typeof i1.MatInput]>;
}

// (No @packageDocumentation comment for this package)
Expand Down