Webpack problems runing on android

[danielgek]

So i was in the process of getting webpack/aot working in an application, and something weird happened: when i try to use the securestorage i got the following error:

JS: Angular is running in the development mode. Call enableProdMode() to enable the production mode.
JS: ERROR Error: Uncaught (in promise): ReferenceError: SAMKeychainQuery is not defined
JS: ReferenceError: SAMKeychainQuery is not defined
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:96216:25
JS:     at new ZoneAwarePromise (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59384:29)
JS:     at SecureStorage.module.exports.SecureStorage.get (file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:96215:16)
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:3062:33
JS:     at new ZoneAwarePromise (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59384:29)
JS:     at StorageService.module.exports.StorageService.oldStorageDecrypt (file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:3061:16)
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:3093:23
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invoke (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:58973:26)
JS:     at Object.onInvoke (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:4625:37)
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invoke (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:58972:32)
JS:     at Zone.module.exports.Zone.run (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:58733:43)
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59368:57
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invokeTask (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59006:31)
JS:     at Object.onInvokeTask (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:4616:37)
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invokeTask (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59005:36)
JS: ERROR Error: Uncaught (in promise): ReferenceError: SAMKeychainQuery is not defined
JS: ReferenceError: SAMKeychainQuery is not defined
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:96216:25
JS:     at new ZoneAwarePromise (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59384:29)
JS:     at SecureStorage.module.exports.SecureStorage.get (file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:96215:16)
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:3062:33
JS:     at new ZoneAwarePromise (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59384:29)
JS:     at StorageService.module.exports.StorageService.oldStorageDecrypt (file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:3061:16)
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/bundle.js:3093:23
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invoke (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:58973:26)
JS:     at Object.onInvoke (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:4625:37)
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invoke (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:58972:32)
JS:     at Zone.module.exports.Zone.run (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:58733:43)
JS:     at file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59368:57
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invokeTask (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59006:31)
JS:     at Object.onInvokeTask (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:4616:37)
JS:     at ZoneDelegate.module.exports.ZoneDelegate.invokeTask (file:///data/data/pt.minsaude.spms.ces/files/app/vendor.js:59005:36)
chromium: [INFO:library_loader_hooks.cc(163)] Chromium logging enabled: level = 0, default verbosity = 0

after investigating the bundle.js i saw that it contains the two implementations and on android it uses the ios one:

/***/ }),
/* 494 */
/* unknown exports provided */
/* all exports used */
/*!******************************************************************!*\
  !*** ../~/nativescript-secure-storage/secure-storage.android.js ***!
  \******************************************************************/
/***/ (function(module, exports, __webpack_require__) {

"use strict";

var utils = __webpack_require__(/*! utils/utils */ 7);
var SecureStorage = (function () {
    function SecureStorage() {
        this.hawk = com.orhanobut.hawk.Hawk.init(utils.ad.getApplicationContext()).build();
    }
    SecureStorage.prototype.get = function (arg) {
        var that = this;
        return new Promise(function (resolve, reject) {
            resolve(com.orhanobut.hawk.Hawk.get(arg.key));
        });
    };
    ;
    SecureStorage.prototype.set = function (arg) {
        return new Promise(function (resolve, reject) {
            resolve(com.orhanobut.hawk.Hawk.put(arg.key, arg.value));
        });
    };
    ;
    SecureStorage.prototype.remove = function (arg) {
        return new Promise(function (resolve, reject) {
            resolve(com.orhanobut.hawk.Hawk.delete(arg.key));
        });
    };
    ;
    return SecureStorage;
}());
exports.SecureStorage = SecureStorage;
//# sourceMappingURL=secure-storage.android.js.map

/***/ }),
/* 495 */
/* unknown exports provided */
/* all exports used */
/*!**************************************************************!*\
  !*** ../~/nativescript-secure-storage/secure-storage.ios.js ***!
  \**************************************************************/
/***/ (function(module, exports, __webpack_require__) {

"use strict";

var SecureStorage = (function () {
    function SecureStorage() {
        this.defaultService = "my_app";
    }
    SecureStorage.prototype.get = function (arg) {
        var that = this;
        return new Promise(function (resolve, reject) {
            var query = SAMKeychainQuery.new();
            query.service = arg.service || that.defaultService;
            query.account = arg.key;
            try {
                query.fetch();
                resolve(query.password);
            }
            catch (e) {
                resolve(null);
            }
        });
    };
    ;
    SecureStorage.prototype.set = function (arg) {
        var that = this;
        return new Promise(function (resolve, reject) {
            var accessibility = kSecAttrAccessibleAlwaysThisDeviceOnly;
            SAMKeychain.setAccessibilityType(accessibility);
            var query = SAMKeychainQuery.new();
            query.service = arg.service || that.defaultService;
            query.account = arg.key;
            query.password = arg.value;
            resolve(query.save());
        });
    };
    ;
    SecureStorage.prototype.remove = function (arg) {
        var that = this;
        return new Promise(function (resolve, reject) {
            var query = SAMKeychainQuery.new();
            query.service = arg.service || that.defaultService;
            query.account = arg.key;
            try {
                resolve(query.deleteItem());
            }
            catch (e) {
                resolve(false);
            }
        });
    };
    ;
    return SecureStorage;
}());
exports.SecureStorage = SecureStorage;
//# sourceMappingURL=secure-storage.ios.js.map

@EddyVerbruggen do you have any idea of what could it be ?

[EddyVerbruggen]

Hi @danielgek I just ran into the same issue. Did you figure it out? I'll take a look as well..

[EddyVerbruggen]

Ah, I think the rootcause is this line.

[danielgek]

@EddyVerbruggen i haven't touched on this in a while(working on big rewrite), and yes, that line seams to be the root cause

[danielgek]

do you have any idea how to fix it ?

[EddyVerbruggen]

Working on it.. that line was from the plugin seed I used. Changing it to .android instead gets the job done, but looking for the best approach.

[EddyVerbruggen]

Status update: I really hate webpack right now.

[EddyVerbruggen]

Status update: I've tried different things but didn't find a good alternative.

For the momentI'm just changing .ios to .android in index.d.ts in node_modules/nativescript-secure-storage. Yes that sucks, but I think it's a temporary glitch in the webpack bundler logic.

[EddyVerbruggen]

I noticed that when I injected the plugin class in a @Component constructor I would run into problems, but when you simply do new SecureStorage there is no problem.