Problem with provider's object with inAppPurchase2 plugin and ionic events


#1

system info

OSX Sierra 10.12.05
Device: iPad 2, iOS 9.3
Plugin Version: 6.1.2

global packages:
    Cordova CLI : 7.0.1 

local packages:
    @ionic/app-scripts : 2.1.3
    Cordova Platforms  : ios 4.4.0
    Ionic Framework    : ionic-angular 3.6.0

System:
    Node       : v6.11.0
    OS         : macOS Sierra
    Xcode      : Xcode 8.3.3 Build version 8E3004b 
    ios-deploy : 1.9.1 
    ios-sim    : 6.0.0 
    npm        : 3.10.10 

Expected behavior

I has a strange bug that I try to explain.
I has a provider with object with some subscription data:
store.ts

import { Injectable } from '@angular/core';
@Injectable()
export class Store {
  data: any = {};

  constructor() { 
    this.newStoreData();
  }

  newStoreData () {
    console.log('new store');
    this.data = {
      activeSub: false, // active subscription or not
      subType: '0', // 0 - no subscription, 'full' - full year subscription
      full: {
        title: '',
        price: '',
        bought: false
      }
    };
  }
}

In app.component plugin initializing store and updating Store.data object with corrected values. When user buy full subscription object’s data updating again and push ‘store:subwoned’ event:
app.component

import { Store } from '../providers/store';
constructor(public events: Events, private inAppPurchase: InAppPurchase2, public store: Store) {
  this.platform.ready().then(() => {
      this.initStore();
  }
}
initStore() {
    if (!this.platform.is('cordova')) {
      console.warn('Store not initialized. Cordova is not available - Run in physical device');
      return;
    }
    if (!this.inAppPurchase) {
      console.log('Store not available');
      return;
    }

    this.inAppPurchase.verbosity = this.inAppPurchase.INFO;

    this.inAppPurchase.register({
      id:    'full_year',
      alias: 'full',
      type:   this.inAppPurchase.PAID_SUBSCRIPTION
    });

    this.saveStoreFullInfo();

    this.inAppPurchase.once("full").approved(order => { 
      console.log('You just unlocked the FULL VERSION!'); 
      this.saveStoreFullInfo(); // fill this.store.data object: this.store.data.activeSub = true, this.store.data.subType = 'full', this.store.data.full.bought = true
      this.events.publish('store:subowned'); // tell to menu page that it must to update
      order.finish();
    });

    this.inAppPurchase.when("full").updated(() => {
      console.log('FULL UPDATED!'); 
      this.saveStoreFullInfo();
    });

    this.inAppPurchase.error(error => { 
      console.log('ERROR ' + error.code + ': ' + error.message);
      let toast = this.toastCtrl.create({
        message: error.message,
        duration: 3000,
        position: 'top'
      });
      toast.present();
    }); 

    this.inAppPurchase.refresh();
  }

  saveStoreFullInfo() {
    let storeItem = this.inAppPurchase.get("full");
    this.store.data.activeSub = storeItem.owned;
    if (storeItem.owned)
      this.store.data.subType = 'full';
    this.store.data.full = {
      title: storeItem.title,
      price: storeItem.price,
      bought: storeItem.owned
    };
  }

BuyPage has a button with method for buying full version:
buy.ts

buyItem(type: string) {
    console.log('buy from store');
    console.log(type + ' object:', this.inAppPurchase.get(type));
    this.inAppPurchase.order(type);
  }

And in MenuPage app catch ‘store:subowned’ event to refresh menu with corrected items list, but in function of subscribe method object’s keys has old values:
menu.ts

this.events.subscribe('store:subowned', () => {
  console.log('buy catched');
  console.log('store:', this.store); // on this step store object has old values - this.store.data.activeSub = false, this.store.data.subType = '0', this.store.data.full.bought = false
  this.userSubName = this.translate.instant('BUY_MENU_SUB_TYPE_' + this.store.data.subType.toUpperCase()); // wrong value (no subscription)
  this.buildMenu();
});

buildMenu() {
    this.pages = [];
    console.log('store build', this.store); // in console object has key this.store.data.activeSub with true value!
    console.log('store build activeSub', this.store.data.activeSub); // console writes false!
    console.log('store build full bought', this.store.data.full.bought); // console writes false!
    if (this.store.data.activeSub) { // false
      console.log('subscribe is active');
      this.pages = this.subPages;
      this.rootPage = MainPage;
    } else { 
      console.log('subscribe disabled');
      this.rootPage = BuyPage;
      this.subscribeEvent('store:subowned');
    }
    this.pages = this.pages.concat(this.lastPages);
  }

Very similar that Store object in menu.ts not is the same to Store object from app.component.ts or something. I don’t know how to explain this problem. Can U help me?

And this two screens of one(!) object from Safari Developer Tools when it collapsed and expanded:
image
image
What’s wrong with that??

Observed behavior

Store object in subscribe method of menu.ts must has the same values as Store object in app.component after buying subscription.

Steps to reproduce

  1. Create app
  2. Install cordova-plugin-purchase plugin
  3. Add inAppPurchase subscription in iTunes Connect
  4. Try to buy sub with update menu through events.

#2

May be topic must be in Ionic Native category?


#3

Have you found a solution to this? I was experiencing similar issues with InAppPurchase but then they updated the @ionic-native library which helped handle it.


#4

Nope. About what update are u talking?