Skip to content

Commit bd3e2fb

Browse files
devversionjelbourn
authored andcommitted
refactor(ng-update): add links to migration guide in v9 hammer migration (#17769)
* Adds link to the migration guide in the v9 hammer migration * Cleans up the gesture config to be less verbose, and to work with the default TSLint configuration in CLI projects
1 parent 8466ed2 commit bd3e2fb

File tree

2 files changed

+33
-37
lines changed

2 files changed

+33
-37
lines changed
Lines changed: 25 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,61 +1,53 @@
11
/**
22
* Custom HammerJS configuration forked from Angular Material. With Angular v9,
33
* Angular Material dropped HammerJS as a dependency. This configuration was added
4-
* automatically to this application because `ng update` detected that this application
5-
* directly used HammerJS.
4+
* automatically to this application because ng-update detected that this application
5+
* directly used custom HammerJS gestures defined by Angular Material.
66
*
7-
* If this application does not depend on the custom gestures originally defined by
8-
* Angular Material, this file can be deleted.
7+
* Read more in the dedicated guide: https://git.io/ng-material-v9-hammer-migration
98
*/
109

1110
import {Injectable, Inject, Optional, Type} from '@angular/core';
1211
import {HammerGestureConfig} from '@angular/platform-browser';
1312
import {MAT_HAMMER_OPTIONS} from '@angular/material/core';
1413

15-
const SUPPORTED_CUSTOM_GESTURES = [
16-
'longpress',
17-
'slide',
18-
'slidestart',
19-
'slideend',
20-
'slideright',
21-
'slideleft'
22-
];
23-
2414
/**
25-
* Fake HammerInstance that is used when a Hammer instance is requested when
26-
* HammerJS has not been loaded on the page.
15+
* Noop hammer instance that is used when an instance is requested, but
16+
* Hammer has not been loaded on the page yet.
2717
*/
2818
const noopHammerInstance = {
2919
on: () => {},
3020
off: () => {},
3121
};
3222

3323
/**
34-
* Adjusts configuration of our gesture library, Hammer.
35-
* @deprecated No longer being used. To be removed.
36-
* @breaking-change 10.0.0
24+
* Gesture config that provides custom Hammer gestures on top of the default Hammer
25+
* gestures. These gestures will be available as events in component templates.
3726
*/
3827
@Injectable()
3928
export class GestureConfig extends HammerGestureConfig {
40-
/** List of new event names to add to the gesture support list */
41-
events = SUPPORTED_CUSTOM_GESTURES;
42-
43-
constructor(
44-
@Optional() @Inject(MAT_HAMMER_OPTIONS) private _hammerOptions?: any) {
29+
/** List of event names to add to the Hammer gesture plugin list */
30+
events = [
31+
'longpress',
32+
'slide',
33+
'slidestart',
34+
'slideend',
35+
'slideright',
36+
'slideleft'
37+
];
38+
39+
constructor(@Optional() @Inject(MAT_HAMMER_OPTIONS) private hammerOptions?: any) {
4540
super();
4641
}
4742

4843
/**
4944
* Builds Hammer instance manually to add custom recognizers that match the
50-
* Material Design spec.
51-
*
52-
* Our gesture names come from the Material Design gestures spec:
53-
* https://material.io/design/#gestures-touch-mechanics
54-
*
55-
* More information on default recognizers can be found in Hammer docs:
56-
* http://hammerjs.github.io/recognizer-pan/
57-
* http://hammerjs.github.io/recognizer-press/
45+
* Material Design specification. Gesture names originate from the Material Design
46+
* gestures: https://material.io/design/#gestures-touch-mechanics
5847
*
48+
* More information on default recognizers can be found in the Hammer docs:
49+
* http://hammerjs.github.io/recognizer-pan/
50+
* http://hammerjs.github.io/recognizer-press/
5951
* @param element Element to which to assign the new HammerJS gestures.
6052
* @returns Newly-created HammerJS instance.
6153
*/
@@ -66,7 +58,7 @@ export class GestureConfig extends HammerGestureConfig {
6658
return noopHammerInstance;
6759
}
6860

69-
const mc = new hammer(element, this._hammerOptions || undefined);
61+
const mc = new hammer(element, this.hammerOptions || undefined);
7062

7163
// Default Hammer Recognizers.
7264
const pan = new hammer.Pan();
@@ -95,11 +87,10 @@ export class GestureConfig extends HammerGestureConfig {
9587
}
9688

9789
/** Creates a new recognizer, without affecting the default recognizers of HammerJS */
98-
private _createRecognizer(base: Object, options: any, ...inheritances: Object[]) {
90+
private _createRecognizer(base: object, options: any, ...inheritances: object[]) {
9991
const recognizer = new (base.constructor as Type<any>)(options);
10092
inheritances.push(base);
10193
inheritances.forEach(item => recognizer.recognizeWith(item));
10294
return recognizer;
10395
}
104-
10596
}

src/material/schematics/ng-update/upgrade-rules/hammer-gestures-v9/hammer-gestures-rule.ts

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -178,7 +178,8 @@ export class HammerGesturesRule extends MigrationRule<null> {
178178
'The HammerJS v9 migration for Angular Components detected that HammerJS is ' +
179179
'manually set up in combination with references to the Angular Material gesture ' +
180180
'config. This target cannot be migrated completely, but all references to the ' +
181-
'deprecated Angular Material gesture have been removed.');
181+
'deprecated Angular Material gesture have been removed. Read more here: ' +
182+
'https://git.io/ng-material-v9-hammer-ambiguous-usage');
182183
} else if (usedInTemplate && this._gestureConfigReferences.length) {
183184
// Since there is a reference to the Angular Material gesture config, and we detected
184185
// usage of a gesture event that could be provided by Angular Material, we *cannot*
@@ -188,7 +189,8 @@ export class HammerGesturesRule extends MigrationRule<null> {
188189
'The HammerJS v9 migration for Angular Components detected that HammerJS is ' +
189190
'manually set up in combination with references to the Angular Material gesture ' +
190191
'config. This target cannot be migrated completely. Please manually remove ' +
191-
'references to the deprecated Angular Material gesture config.');
192+
'references to the deprecated Angular Material gesture config. Read more here: ' +
193+
'https://git.io/ng-material-v9-hammer-ambiguous-usage');
192194
}
193195
} else if (this._usedInRuntime || usedInTemplate) {
194196
// We keep track of whether Hammer is used globally. This is necessary because we
@@ -228,7 +230,8 @@ export class HammerGesturesRule extends MigrationRule<null> {
228230
this.printInfo(
229231
'The HammerJS v9 migration for Angular Components migrated the ' +
230232
'project to keep HammerJS installed, but detected ambiguous usage of HammerJS. Please ' +
231-
'manually check if you can remove HammerJS from your application.');
233+
'manually check if you can remove HammerJS from your application. More details: ' +
234+
'https://git.io/ng-material-v9-hammer-ambiguous-usage');
232235
}
233236
}
234237

@@ -852,6 +855,8 @@ export class HammerGesturesRule extends MigrationRule<null> {
852855
'\n⚠ General notice: The HammerJS v9 migration for Angular Components is not able to ' +
853856
'migrate tests. Please manually clean up tests in your project if they rely on ' +
854857
(this.globalUsesHammer ? 'the deprecated Angular Material gesture config.' : 'HammerJS.')));
858+
context.logger.info(
859+
'Read more about migrating tests: https://git.io/ng-material-v9-hammer-migrate-tests');
855860

856861
if (!this.globalUsesHammer && this._removeHammerFromPackageJson(tree)) {
857862
// Since Hammer has been removed from the workspace "package.json" file,

0 commit comments

Comments
 (0)