Method connectedCallback

core/src/components/menu/menu.tsx:201–254

()

  @Event() protected ionMenuChange!: EventEmitter<MenuChangeEventDetail>;

  async connectedCallback() {
    // TODO: connectedCallback is fired in CE build
    // before WC is defined. This needs to be fixed in Stencil.
    if (typeof customElements !== 'undefined' && customElements != null) {
      await customElements.whenDefined('ion-menu');
    }

    if (this.type === undefined) {
      this.type = config.get('menuType', 'overlay');
    }

    if (!Build.isBrowser) {
      return;
    }

    const content = this.contentId !== undefined ? document.getElementById(this.contentId) : null;

    if (content === null) {
      printIonError('[ion-menu] - Must have a "content" element to listen for drag events on.');
      return;
    }

    if (this.el.contains(content)) {
      printIonError(
        `[ion-menu] - The "contentId" should refer to the main view's ion-content, not the ion-content inside of the ion-menu.`
      );
    }

    this.contentEl = content as HTMLElement;

    // add menu's content classes
    content.classList.add('menu-content');

    this.typeChanged(this.type!, undefined);
    this.sideChanged();

    // register this menu with the app's menu controller
    menuController._register(this);

    this.menuChanged();
    this.gesture = (await import('../../utils/gesture')).createGesture({
      el: document,
      gestureName: 'menu-swipe',
      gesturePriority: 30,
      threshold: 10,
      blurOnStart: true,
      canStart: (ev) => this.canStart(ev),
      onWillStart: () => this.onWillStart(),
      onStart: () => this.onStart(),
      onMove: (ev) => this.onMove(ev),
      onEnd: (ev) => this.onEnd(ev),
    });
    this.updateState();
  }

  componentWillLoad() {
    this.inheritedAttributes = inheritAriaAttributes(this.el);