bug: fab-button with type "submit" does not submit the form

Bug Report

Ionic version: [x] 4.x

Current behavior: Hi, I want to use a fab button type submit inside a form but it doesn’t trigger ngSubmit. Please Help.

Expected behavior: It works when I use a normal button but I wanted to use FAB bc of the style and easily way to put it aligned in the page.

Steps to reproduce:

Related code:

<form [formGroup]="enviarDocumentosForm" style="padding-top: 0;" (submit)="enviarDocumentos(enviarDocumentosForm.value)">
    <ion-row justify-content-center align-items-center style="height: 100%; margin:auto;">
      <ion-col size-md="6" size-lg="5" size-xs="12">
        <div padding>
          <ion-row justify-content-center>
            <ion-label floating>Digite o CPF do cliente</ion-label>
          </ion-row>
          <br/>
          <ion-row justify-content-center>
            <ion-item lines="none"> 
              <div class="ion-text-center">
                <ion-input id="nrCpfClienteId" type="tel" formControlName="nrCpfCliente" placeholder="CPF" placego clearInput clearOnEdit="false" maxlength="14"  [brmasker]="{form: enviarDocumentosForm.get('nrCpfCliente'), person: true}"></ion-input>
              </div>
            </ion-item>
          </ion-row>
        </div>
      </ion-col>
    </ion-row>
    <ion-fab vertical="bottom" horizontal="end" slot="fixed">
      <ion-fab-button type="submit">
          <ion-icon name="cloud-upload"></ion-icon>
      </ion-fab-button>
    </ion-fab>
  </form>

Other information:

https://forum.ionicframework.com/t/someform-ngform-the-someform-submitted-flag-is-not-working-ionic-4/158661

There are people with the same issue and the documentation shows that ion-fab-button has type property with submit as option.

Ionic info:

Ionic:

   ionic (Ionic CLI)             : 4.9.0 (C:\Users\Alex\ambiente\projetos.neon\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.4.2
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.2.4
   @ionic/angular-toolkit        : 1.3.0

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.4
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 3.1.2, (and 14 other plugins)

System:

   NodeJS : v10.13.0 (C:\Program Files\nodejs\node.exe)
   npm    : 6.4.1
   OS     : Windows 10

[atsoares]

@meisterlampe in the page.sccs I changed the ion-button css to the same fab-button css, like this:

:host{
  ion-button{
    --transition: background-color,opacity 100ms linear;
    --ripple-color: currentColor;
    --border-radius: 50%;
    --border-width: 0;
    --border-style: none;
    --border-color: initial;
    --padding-top: 0;
    --padding-end: 0;
    --padding-bottom: 0;
    --padding-start: 0;
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    margin-bottom: 0;   
    display: block;     
    width: 56px;
    height: 56px;
    position: relative;
    font-size: 14px;
    text-align: center;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap;
    -webkit-font-kerning: none;
    font-kerning: none;
    ion-icon{
      margin: 0;
      position: absolute;
      top: 50%;
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
    }
  }
}

[meisterlampe]

Works like a charm. Thanks a lot for your fast answer!