* Updates the position of the drawer in the DOM. We need to move the element around ourselves * when it's in the `end` position so that it comes after the content and the visual order * matches the tab order. We also need to be able to move it back to `start` if the sidenav * started off as
(newPosition: 'start' | 'end')
| 648 | * started off as `end` and was changed to `start`. |
| 649 | */ |
| 650 | private _updatePositionInParent(newPosition: 'start' | 'end'): void { |
| 651 | // Don't move the DOM node around on the server, because it can throw off hydration. |
| 652 | if (!this._platform.isBrowser) { |
| 653 | return; |
| 654 | } |
| 655 | |
| 656 | const element = this._elementRef.nativeElement; |
| 657 | const parent = element.parentNode!; |
| 658 | |
| 659 | if (newPosition === 'end') { |
| 660 | if (!this._anchor) { |
| 661 | this._anchor = this._doc.createComment('mat-drawer-anchor')!; |
| 662 | parent.insertBefore(this._anchor!, element); |
| 663 | } |
| 664 | |
| 665 | parent.appendChild(element); |
| 666 | } else if (this._anchor) { |
| 667 | this._anchor.parentNode!.insertBefore(element, this._anchor); |
| 668 | } |
| 669 | } |
| 670 | |
| 671 | /** Event handler for animation events. */ |
| 672 | private _handleTransitionEvent = (event: TransitionEvent) => { |
no outgoing calls
no test coverage detected