Ionic app freezes frequently on ios

Hi,
I am building an ionic 2 app but it happens frequently when I logout and click log in button the app freezes. I am unable to figure out the cause as its not giving any error in console. Even its not showing any error in bugsnag. 6 out 10 times my app freezes when I click log in button. Below is the code snippet of my login page(login.ts) :

import { Component, ViewChild } from '@angular/core';
import { IonicPage, NavController, NavParams, AlertController,MenuController } from 'ionic-angular';
import { HomePage } from '../home/home';
import { Events } from 'ionic-angular';
import { ArtistProfilePage } from '../artist-profile/artist-profile';
import { FanTabs } from '../fan-tabs/fan-tabs';
import {ConfirmUser} from "../confirm-user/confirm-user";
import {ArtistTabs} from "../artist-tabs/artist-tabs";

@Component({
  selector: 'login-page',
  templateUrl: 'login.html'
})
export class LoginPage {
  loginCredentials = { email: '', password: '' };
  notConfirmed = true;
  fullHeight = '50%';
  public latitude: number;
  public longitude: number;
  menu;
  confirmToken;
  confirmed;
  constructor(menu: MenuController, public navCtrl: NavController, public navParams: NavParams, public events: Events, public alertCtrl: AlertController) {

  this.confirmToken = this.navParams.get('confirmToken');
    this.menu = menu
    this.confirmToken = this.navParams.get('confirmToken');
    this.notConfirmed = JSON.parse(localStorage.getItem('register_user'));
    this.confirmed = JSON.parse(localStorage.getItem('confirmationMsg'));
    if(this.notConfirmed){
      this.fullHeight = '25%';
    } else if (this.confirmed) {
       this.fullHeight = '28%';
    }
  }
  ionViewWillEnter(){
    this.menu.enable(false);
    if (this.confirmToken != undefined){
       var confirmData = {
              "action": "confirm-my-account",
              "email": this.confirmToken 
              };
       this.events.publish('setData', confirmData);
    }
   
  }
  ionViewWillLeave(){
    this.menu.enable(true);
  }

  ionViewDidLoad() {
    var data = {
      'action': 'dummy.request',
    }
    this.events.publish('setData', data);
    localStorage.clear();
    this.ngOnInit();
  }

  public register() {
    this.navCtrl.push(ConfirmUser, {});
  }

  public logIn() {
    if(this.loginCredentials.password == ""){
      let alert = this.alertCtrl.create({
        subTitle: 'Password can not be blank.',
        buttons: ['OK']
      });
      alert.present();
    }
    else if(this.loginCredentials.email == ""){
      let alert = this.alertCtrl.create({
        subTitle: 'Email can not be blank.',
        buttons: ['OK']
      });
      alert.present();
    }
    else{
      var data = {
        'action': 'users.login',
        email: this.loginCredentials.email,
        password: this.loginCredentials.password
      }
      this.events.publish('setData', data);
    }
  }
}

This is my logout code snippet :

if(page == 'LogOut'){
      let alert = this.alertCtrl.create({
        message: 'Are you sure, you want to logout?',
        buttons: [
          {
            text: 'No',
            role: 'cancel',
            handler: () => {
            }
          },
          {
            text: 'Yes',
            handler: () => {
              localStorage.clear();
              this.menu.close();
              this.nav.setRoot(LoginPage);
              this.ws.close();
            }
          }
        ]
      });
      alert.present();

Thanx in advance if any one could help me out.Preformatted text

Please edit your post, it is not very readable at the moment.
Use the </> button above the input field to format your code, command line output or error message (select the text first, then click the button or wrap it in ``` manually). Check the preview if it looks better. This will make sure your text is readable and if it recognizes the programming language it also automatically adds code syntax highlighting. Thanks.

Can you define “freeze” a bit more please?

Thanx I will make my code more readable in few minutes.
By “freeze” I meant that when I click on login button the app hangs and it does not enter the home page . Nothing works thereafter and I have to kill the app.

1 Like

Can you please add the template code of the login button being clicked that causes the freezing?

Also post your ionic info output please.

ionic info output :
This output is from my linux system for android. As now I cannot access my mac at this moment so I am unable to provide ionic info from mac.

global packages:

@ionic/cli-utils : 1.1.2
Cordova CLI      : 7.0.1 
Ionic CLI        : 3.1.2

local packages:

@ionic/app-scripts              : 1.3.6
@ionic/cli-plugin-cordova       : 1.4.0
@ionic/cli-plugin-ionic-angular : 1.3.1
Cordova Platforms               : android 6.2.3
Ionic Framework                 : ionic-angular 3.1.1

System:

Node       : v7.10.0
OS         : Linux 4.4
Xcode      : not installed
ios-deploy : not installed
ios-sim    : not installed

login.html:

<ion-content padding class="login-page">
  <img src="assets/relimu_logo_blk.svg" class="select-user-type"/>
  <div *ngIf="confirmed;" class = "registration-confirmation">
      <span>
         Your account has been successfully confirmed.<br />
  </span>
  </div>

  <div *ngIf="notConfirmed;" class = "registration-confirmation">
    <span>
      THANKS FOR REGISTERING.<br />
      Please check the email and respond<br />
      to the confirmation message.
    </span>
  </div>

  <form (ngSubmit)="itemTapped()" [ngStyle]="{'margin-top': fullHeight}" class="login-input-fields">
  <ion-grid>
    <ion-row class="email-flex">
      <ion-icon class="user-name-icon" name="ios-contact-outline"></ion-icon>
      <div style="flex:2;">
        <ion-item style="background: transparent">
          <ion-label stacked class="relimu-label">EMAIL</ion-label>
          <ion-input type="text" placeholder="Enter Email" class="relimu-inputfield" name="email" [(ngModel)]="loginCredentials.email"></ion-input>
        </ion-item>
      </div>
    </ion-row>

    <ion-row  class="email-flex">
      <ion-icon class="user-name-icon" name="ios-lock-outline"></ion-icon>
      <div style="flex:2">
        <ion-item style="background: transparent">
          <ion-label stacked class="relimu-label" >PASSWORD</ion-label>
          <ion-input type="password" placeholder="********" class="relimu-inputfield" name="password" [(ngModel)]="loginCredentials.password"></ion-input>
        </ion-item>
      </div>
    </ion-row>

    <ion-row class="login_button_row">
      <ion-col>
        <button ion-button color="light" outline  type="submit" class="login-button"><b>LOG IN</b></button>
      </ion-col>
    </ion-row>

    <ion-row>
      <ion-col text-center>
        <div class='sign_up_text'>DON'T  HAVE  AN  ACCOUNT?
          <span class='sign_up_link' (click)="register()"><b>SIGN UP</b></span>
        </div>
      </ion-col>
    </ion-row>

  </ion-grid>
  </form>

</ion-content>

This my ionic info output from mac:

lobal packages:
    @ionic/cli-utils : 1.4.0

    Cordova CLI      : 6.5.0 

    Ionic CLI        : 3.4.0



local packages:



    @ionic/app-scripts              : 1.3.6

    @ionic/cli-plugin-cordova       : 1.1.2

    @ionic/cli-plugin-ionic-angular : 1.1.2

    Ionic Framework                 : ionic-angular 3.1.1



System:



    Node       : v7.5.0

    OS         : macOS Sierra

    Xcode      : Xcode 8.3.2 Build version 8E2002 

    ios-deploy : 1.9.1 

    ios-sim    : not installed

    npm        : 4.1.2

Hi @Sujan12 @amit8749
Is there any solution for the app freeze(only in ios devices)?

2 Likes