Skip to content

Commit 08fba43

Browse files
authored
Revert "feat(material/tooltip): add option to open tooltip at mouse position (#25202)" (#25430)
This reverts commit 1337f36.
1 parent 20db76d commit 08fba43

File tree

10 files changed

+27
-269
lines changed

10 files changed

+27
-269
lines changed

src/cdk/overlay/position/flexible-connected-position-strategy.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -98,7 +98,7 @@ export class FlexibleConnectedPositionStrategy implements PositionStrategy {
9898
_preferredPositions: ConnectionPositionPair[] = [];
9999

100100
/** The origin element against which the overlay will be positioned. */
101-
_origin: FlexibleConnectedPositionStrategyOrigin;
101+
private _origin: FlexibleConnectedPositionStrategyOrigin;
102102

103103
/** The overlay pane element. */
104104
private _pane: HTMLElement;

src/components-examples/material/tooltip/index.ts

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ import {TooltipMessageExample} from './tooltip-message/tooltip-message-example';
1616
import {TooltipModifiedDefaultsExample} from './tooltip-modified-defaults/tooltip-modified-defaults-example';
1717
import {TooltipOverviewExample} from './tooltip-overview/tooltip-overview-example';
1818
import {TooltipPositionExample} from './tooltip-position/tooltip-position-example';
19-
import {TooltipPositionAtOriginExample} from './tooltip-position-at-origin/tooltip-position-at-origin-example';
2019
import {TooltipHarnessExample} from './tooltip-harness/tooltip-harness-example';
2120

2221
export {
@@ -30,7 +29,6 @@ export {
3029
TooltipModifiedDefaultsExample,
3130
TooltipOverviewExample,
3231
TooltipPositionExample,
33-
TooltipPositionAtOriginExample,
3432
};
3533

3634
const EXAMPLES = [
@@ -44,7 +42,6 @@ const EXAMPLES = [
4442
TooltipModifiedDefaultsExample,
4543
TooltipOverviewExample,
4644
TooltipPositionExample,
47-
TooltipPositionAtOriginExample,
4845
];
4946

5047
@NgModule({

src/components-examples/material/tooltip/tooltip-position-at-origin/tooltip-position-at-origin-example.css

Lines changed: 0 additions & 8 deletions
This file was deleted.

src/components-examples/material/tooltip/tooltip-position-at-origin/tooltip-position-at-origin-example.html

Lines changed: 0 additions & 10 deletions
This file was deleted.

src/components-examples/material/tooltip/tooltip-position-at-origin/tooltip-position-at-origin-example.ts

Lines changed: 0 additions & 14 deletions
This file was deleted.

src/dev-app/tooltip/tooltip-demo.html

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,3 @@ <h3>Tooltip overview</h3>
2424

2525
<h3>Tooltip positioning</h3>
2626
<tooltip-position-example></tooltip-position-example>
27-
28-
<h3>Tooltip with position at origin</h3>
29-
<tooltip-position-at-origin-example></tooltip-position-at-origin-example>

src/material/legacy-tooltip/tooltip.spec.ts

Lines changed: 7 additions & 91 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ import {
1111
dispatchFakeEvent,
1212
dispatchKeyboardEvent,
1313
dispatchMouseEvent,
14-
dispatchTouchEvent,
1514
patchElementFocus,
1615
} from '../../cdk/testing/private';
1716
import {
@@ -233,63 +232,6 @@ describe('MatTooltip', () => {
233232
expect(tooltipDirective._getOverlayPosition().fallback.overlayX).toBe('end');
234233
}));
235234

236-
it('should position center-bottom by default', fakeAsync(() => {
237-
TestBed.resetTestingModule()
238-
.configureTestingModule({
239-
imports: [MatLegacyTooltipModule, OverlayModule],
240-
declarations: [WideTooltipDemo]
241-
})
242-
.compileComponents();
243-
244-
const wideFixture = TestBed.createComponent(WideTooltipDemo);
245-
wideFixture.detectChanges();
246-
tooltipDirective = wideFixture.debugElement
247-
.query(By.css('button'))!
248-
.injector.get<MatLegacyTooltip>(MatLegacyTooltip);
249-
const button: HTMLButtonElement = wideFixture.nativeElement.querySelector('button');
250-
const triggerRect = button.getBoundingClientRect();
251-
252-
dispatchMouseEvent(button, 'mouseenter', triggerRect.right - 100, triggerRect.top + 100);
253-
wideFixture.detectChanges();
254-
tick();
255-
expect(tooltipDirective._isTooltipVisible()).toBe(true);
256-
257-
expect(tooltipDirective._overlayRef!.overlayElement.offsetLeft).toBeGreaterThan(triggerRect.left + 200);
258-
expect(tooltipDirective._overlayRef!.overlayElement.offsetLeft).toBeLessThan(triggerRect.left + 300);
259-
expect(tooltipDirective._overlayRef!.overlayElement.offsetTop).toBe(triggerRect.bottom);
260-
}));
261-
262-
it('should be able to override the default positionAtOrigin', fakeAsync(() => {
263-
TestBed.resetTestingModule()
264-
.configureTestingModule({
265-
imports: [MatLegacyTooltipModule, OverlayModule],
266-
declarations: [WideTooltipDemo],
267-
providers: [
268-
{
269-
provide: MAT_TOOLTIP_DEFAULT_OPTIONS,
270-
useValue: {positionAtOrigin: true},
271-
},
272-
],
273-
})
274-
.compileComponents();
275-
276-
const wideFixture = TestBed.createComponent(WideTooltipDemo);
277-
wideFixture.detectChanges();
278-
tooltipDirective = wideFixture.debugElement
279-
.query(By.css('button'))!
280-
.injector.get<MatLegacyTooltip>(MatLegacyTooltip);
281-
const button: HTMLButtonElement = wideFixture.nativeElement.querySelector('button');
282-
const triggerRect = button.getBoundingClientRect();
283-
284-
dispatchMouseEvent(button, 'mouseenter', triggerRect.left + 50, triggerRect.bottom - 10);
285-
wideFixture.detectChanges();
286-
tick();
287-
expect(tooltipDirective._isTooltipVisible()).toBe(true);
288-
289-
expect(tooltipDirective._overlayRef!.overlayElement.offsetLeft).toBe(triggerRect.left + 28);
290-
expect(tooltipDirective._overlayRef!.overlayElement.offsetTop).toBe(triggerRect.bottom - 10);
291-
}));
292-
293235
it('should be able to disable tooltip interactivity', fakeAsync(() => {
294236
TestBed.resetTestingModule()
295237
.configureTestingModule({
@@ -1227,10 +1169,7 @@ describe('MatTooltip', () => {
12271169
fixture.detectChanges();
12281170
const button: HTMLButtonElement = fixture.nativeElement.querySelector('button');
12291171

1230-
const triggerRect = button.getBoundingClientRect();
1231-
const offsetX = triggerRect.right - 10;
1232-
const offsetY = triggerRect.top + 10;
1233-
dispatchTouchEvent(button, 'touchstart', offsetX, offsetY, offsetX, offsetY);
1172+
dispatchFakeEvent(button, 'touchstart');
12341173
fixture.detectChanges();
12351174
tick(250); // Halfway through the delay.
12361175

@@ -1249,10 +1188,7 @@ describe('MatTooltip', () => {
12491188
fixture.detectChanges();
12501189
const button: HTMLButtonElement = fixture.nativeElement.querySelector('button');
12511190

1252-
const triggerRect = button.getBoundingClientRect();
1253-
const offsetX = triggerRect.right - 10;
1254-
const offsetY = triggerRect.top + 10;
1255-
dispatchTouchEvent(button, 'touchstart', offsetX, offsetY, offsetX, offsetY);
1191+
dispatchFakeEvent(button, 'touchstart');
12561192
fixture.detectChanges();
12571193
tick(500); // Finish the delay.
12581194
fixture.detectChanges();
@@ -1265,10 +1201,7 @@ describe('MatTooltip', () => {
12651201
const fixture = TestBed.createComponent(BasicTooltipDemo);
12661202
fixture.detectChanges();
12671203
const button: HTMLButtonElement = fixture.nativeElement.querySelector('button');
1268-
const triggerRect = button.getBoundingClientRect();
1269-
const offsetX = triggerRect.right - 10;
1270-
const offsetY = triggerRect.top + 10;
1271-
const event = dispatchTouchEvent(button, 'touchstart', offsetX, offsetY, offsetX, offsetY);
1204+
const event = dispatchFakeEvent(button, 'touchstart');
12721205
fixture.detectChanges();
12731206

12741207
expect(event.defaultPrevented).toBe(false);
@@ -1279,10 +1212,7 @@ describe('MatTooltip', () => {
12791212
fixture.detectChanges();
12801213
const button: HTMLButtonElement = fixture.nativeElement.querySelector('button');
12811214

1282-
const triggerRect = button.getBoundingClientRect();
1283-
const offsetX = triggerRect.right - 10;
1284-
const offsetY = triggerRect.top + 10;
1285-
dispatchTouchEvent(button, 'touchstart', offsetX, offsetY, offsetX, offsetY);
1215+
dispatchFakeEvent(button, 'touchstart');
12861216
fixture.detectChanges();
12871217
tick(500); // Finish the open delay.
12881218
fixture.detectChanges();
@@ -1306,10 +1236,7 @@ describe('MatTooltip', () => {
13061236
fixture.detectChanges();
13071237
const button: HTMLButtonElement = fixture.nativeElement.querySelector('button');
13081238

1309-
const triggerRect = button.getBoundingClientRect();
1310-
const offsetX = triggerRect.right - 10;
1311-
const offsetY = triggerRect.top + 10;
1312-
dispatchTouchEvent(button, 'touchstart', offsetX, offsetY, offsetX, offsetY);
1239+
dispatchFakeEvent(button, 'touchstart');
13131240
fixture.detectChanges();
13141241
tick(500); // Finish the open delay.
13151242
fixture.detectChanges();
@@ -1474,16 +1401,16 @@ describe('MatTooltip', () => {
14741401
const fixture = TestBed.createComponent(BasicTooltipDemo);
14751402
fixture.detectChanges();
14761403
const button: HTMLButtonElement = fixture.nativeElement.querySelector('button');
1477-
const triggerRect = button.getBoundingClientRect();
14781404

1479-
dispatchMouseEvent(button, 'mouseenter', triggerRect.right - 10, triggerRect.top + 10);
1405+
dispatchFakeEvent(button, 'mouseenter');
14801406
fixture.detectChanges();
14811407
tick(500); // Finish the open delay.
14821408
fixture.detectChanges();
14831409
finishCurrentTooltipAnimation(overlayContainerElement, true);
14841410
assertTooltipInstance(fixture.componentInstance.tooltip, true);
14851411

14861412
// Simulate the pointer over the trigger.
1413+
const triggerRect = button.getBoundingClientRect();
14871414
const wheelEvent = createFakeEvent('wheel');
14881415
Object.defineProperties(wheelEvent, {
14891416
clientX: {get: () => triggerRect.left + 1},
@@ -1629,17 +1556,6 @@ class TooltipDemoWithoutPositionBinding {
16291556
@ViewChild('button') button: ElementRef<HTMLButtonElement>;
16301557
}
16311558

1632-
@Component({
1633-
selector: 'app',
1634-
styles: [`button { width: 500px; height: 500px; }`],
1635-
template: `<button #button [matTooltip]="message">Button</button>`,
1636-
})
1637-
class WideTooltipDemo {
1638-
message = 'Test';
1639-
@ViewChild(MatLegacyTooltip) tooltip: MatLegacyTooltip;
1640-
@ViewChild('button') button: ElementRef<HTMLButtonElement>;
1641-
}
1642-
16431559
/** Asserts whether a tooltip directive has a tooltip instance. */
16441560
function assertTooltipInstance(tooltip: MatLegacyTooltip, shouldExist: boolean): void {
16451561
// Note that we have to cast this to a boolean, because Jasmine will go into an infinite loop

src/material/tooltip/tooltip.md

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -27,12 +27,6 @@ CSS class that can be used for style (e.g. to add an arrow). The possible classe
2727

2828
<!-- example(tooltip-position) -->
2929

30-
To display the tooltip relative to the mouse or touch that triggered it, use the
31-
`matTooltipPositionAtOrigin` input.
32-
With this setting turned on, the tooltip will display relative to the origin of the trigger rather
33-
than the host element. In cases where the tooltip is not triggered by a touch event or mouse click,
34-
it will display the same as if this setting was turned off.
35-
3630
### Showing and hiding
3731

3832
By default, the tooltip will be immediately shown when the user's mouse hovers over the tooltip's

0 commit comments

Comments
 (0)