Repository: ionic-team/ionic-framework
File: core/src/components/alert/alert.tsx (TypeScript)

Code before:
    /**
     * When binding values in frameworks such as Angular
     * it is possible for the value to be set after the Web Component
     * initializes but before the value watcher is set up in Stencil.
     * As a result, the watcher callback may not be fired.
     * We work around this by manually calling the watcher
     * callback when the component has loaded and the watcher
     * is configured.
     */
    this.triggerChanged();
  }

  /**
   * Present the alert overlay after it has been created.
   */
  @Method()
  async present(): Promise<void> {
    const unlock = await this.lockController.lock();

    await this.delegateController.attachViewToDom();

    await present(this, 'alertEnter', iosEnterAnimation, mdEnterAnimation).then(() => {
      if (this.buttons.length === 1 && this.inputs.length === 0) {
        const queryBtn = this.wrapperEl?.querySelector('.alert-button') as HTMLButtonElement;

        queryBtn.focus();
      } else {
        this.wrapperEl?.focus();
      }
    });

    unlock();
  }

  /**
   * Dismiss the alert overlay after it has been presented.
   *
   * @param data Any data to emit in the dismiss events.
   * @param role The role of the element that is dismissing the alert.
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the alert.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
   *
   * This is a no-op if the overlay has not been presented yet. If you want
   * to remove an overlay from the DOM that was never presented, use the
   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */
  @Method()
  async dismiss(data?: any, role?: string): Promise<boolean> {
    const unlock = await this.lockController.lock();


Review comment (suggestion):
Let's add a comment stating why we are doing this check. We want to make sure that it states that it follows accessibility standards for when an alert has no inputs and only one button. That way we don't remove it by accident in the future.

Code after:
    /**
     * When binding values in frameworks such as Angular
     * it is possible for the value to be set after the Web Component
     * initializes but before the value watcher is set up in Stencil.
     * As a result, the watcher callback may not be fired.
     * We work around this by manually calling the watcher
     * callback when the component has loaded and the watcher
     * is configured.
     */
    this.triggerChanged();
  }

  /**
   * Present the alert overlay after it has been created.
   */
  @Method()
  async present(): Promise<void> {
    const unlock = await this.lockController.lock();

    await this.delegateController.attachViewToDom();

    await present(this, 'alertEnter', iosEnterAnimation, mdEnterAnimation).then(() => {
      /**
       * Check if alert has only one button and no inputs.
       * If so, then focus on the button. Otherwise, focus the alert wrapper.
       * This will map to the default native alert behavior.
       */
      if (this.buttons.length === 1 && this.inputs.length === 0) {
        const queryBtn = this.wrapperEl?.querySelector('.alert-button') as HTMLButtonElement;
        queryBtn.focus();
      } else {
        this.wrapperEl?.focus();
      }
    });

    unlock();
  }

  /**
   * Dismiss the alert overlay after it has been presented.
   *
   * @param data Any data to emit in the dismiss events.
   * @param role The role of the element that is dismissing the alert.
   * This can be useful in a button handler for determining which button was
   * clicked to dismiss the alert.
   * Some examples include: ``"cancel"`, `"destructive"`, "selected"`, and `"backdrop"`.
   *
   * This is a no-op if the overlay has not been presented yet. If you want
   * to remove an overlay from the DOM that was never presented, use the
   * [remove](https://developer.mozilla.org/en-US/docs/Web/API/Element/remove) method.
   */