WebView+ not being installed

[TheBikingViking]

Hi

I'm trying to get WebView+ installed for an existing Cordova project, and to do this, I run the following CLI commands:

cocoonjs platform add android
cocoonjs plugin add com.ludei.webview.plus
cocoonjs build android

All of these commands run as expected with success messages; however, WebView+ does actually NOT get installed. The safest way to measure this is by looking at the produced .apk file, which comes in at 11mb - same as before.

Cordova CLI version: 4.1.2
CocoonJS CLI version: 1.0.0-0.8.0

I seem to be following the guide by the book, everything runs fine, but WebView+ is not installed. Can someone help out?

FYI, the same happens with the iOS build (using com.ludei.ios.webview.plus)

[severedsea]

Hi, same here! It just says successful, but I don't see the changes on CordovaWebview.java and project.properties.

[severedsea]

It seems like in the hooks/after_plugin_add/com.ludei.webview.plus.js line 48, it only gets the first plugin in your project's plugin list instead of compiling all your project's plugins and looking for com.ludei.webview.plus where it should install WebView+ (line 64). I can't seem to find a workaround for this. Any help is greatly appreciated.

Cordova version: 3.6.3-0.2.13

[TheBikingViking]

FYI, I'm trying to install and build on OSX, which I'm using to build both the Android and iOS build.

[paishin]

To get webview+ you have to create the project using cocoonjs cli add the webview+ plugin and build at least once before adding any other plugins otherwise it will run in default webview

[TheBikingViking]

How does that combine with the after_platform_add hook? I.e. we're using a script to install the plugins we need after adding the platform, as suggested by this article:

http://devgirl.org/2013/11/12/three-hooks-your-cordovaphonegap-project-needs/

[paishin]

Just create the project using cocoonjs cli, add the platform, then the webview+ plugin and run it once.
Then add your project in www and place plugins, hooks and resources in the appropriate folders.
it should run fine

[TheBikingViking]

But that doesn't really add up with bash script execution, which basically is set up to look like this at the moment:

# Remove and add platform
cocoonjs platform remove android
cocoonjs platform add "android$CORDOVA_VERSION_ANDROID"
cocoonjs plugin add com.ludei.webview.plus

# Build
cocoonjs build android

We don't want to manually define the list of plugins to add here, especially with the after_platform_add hook possibility.

[paishin]

Why would you remove the platform in the first place?

[TheBikingViking]

That's just to clean up from the previous build and start fresh

[paishin]

Ok, I guess you must have your own reasons for doing it this way, I never have to remove the platform in my project.

I guess what you can do is have the bash script add the webview+ and run build an initial time and then continue to automatically add the plugins and re-build a second time.

[TheBikingViking]

I just tried a quick change, removing the after_platform_add hook, and that installed WebView+.

But then I added the additional plugins in the bash script, and then re-built the app, and now it's gone again. I.e. the script is:

1. Add platform
2. Add Webview+ plugin
3. Build app
4. Add other plugins
5. Build app again

[paishin]

Could you paste the script?

[TheBikingViking]

# Remove and add platform
cocoonjs platform remove ios
cocoonjs platform add "ios$CORDOVA_VERSION_IOS"
cocoonjs plugin add com.ludei.ios.webview.plus

# Build
cocoonjs build ios

# Install other plugins
cocoonjs plugin add org.apache.cordova.splashscreen
cocoonjs plugin add org.apache.cordova.device
cocoonjs plugin add org.apache.cordova.statusbar
cocoonjs plugin add de.neofonie.cordova.plugin.nativeaudio
cocoonjs plugin add org.apache.cordova.dialogs
cocoonjs plugin add [email protected]
cocoonjs plugin add org.apache.cordova.globalization
cocoonjs plugin add org.apache.cordova.inappbrowser
cocoonjs plugin add https://github.com/mkristo/cordova-plugin-hockeyapp.git
cocoonjs plugin add https://github.com/phonegap-build/PushPlugin.git

# Re-build
cocoonjs build ios

[TheBikingViking]

I just tried a quick modification of the script, removing the initial lines:

# Remove and add platform
cocoonjs platform remove ios
cocoonjs platform add "ios$CORDOVA_VERSION_IOS"
cocoonjs plugin add com.ludei.ios.webview.plus

# Build
cocoonjs build ios

And then I did the following:

1. Remove platform folder and plugins folder
2. Add the ios project with "cocoonjs platform add ios"
3. Add webview+ with "cocoonjs plugin add com.ludei.ios.webview.plus"
4. Build the ios app with "cocoonjs build ios"
5. Run the script (this script also uses xcrun PackageApplication to create the signed .ipa file)

It seems like whenever I add other plugins, even after first adding the platform, adding webview+ and building the app, it removes webview+.

[paishin]

@TheBikingViking I am on windows so I cant help you with OSX, but running a similar bat file on my pc runs perfectly.

I have added the following code in after_platform_add hooks:

call cocoonjs plugin add com.ludei.webview.plus

ECHO Build
call cocoonjs build android

ECHO Install other plugins
call cocoonjs plugin add org.apache.cordova.splashscreen

### add your plugins here ####

ECHO Re-build
call cocoonjs build android

[severedsea]

@TheBikingViking as a workaround, this is what I did:

1. I copied the after_plugin_add hook com.ludei.webview.plus.js to my after_platform_add (since the goal is to allow to be able to remove/add the platform). But I had to modify some of the configuration values in the App constructor (specifically, the part where it takes values from process.env). Then, I just applied the fix in my pull request Fixed plugin list delimiter to properly list all plugins #37 referenced in this issue.
2. Add the plugin via "cordova plugin add com.ludei.webview.plus".
3. CD into plugins/com.ludei.webview.plus/android, do "ant clean" then "ant run".

Result:
After platform add, the hook will install webview+ on your platform by adding reference to plugins/com.ludei.webview.plus/android project via project.properties and modifying CordovaWebView to extend LudeiWebView.

Note:
This doesn't need cocoonjs-cli.

If you need help on the modified hook file, just let me know.

[TheBikingViking]

@severedsea that sounds very interesting. Would love to see what you did with the modified hook file.

[severedsea]

Here is the modified hook file, copied to after_platform_add folder. I'm not sure how to get all the process.env values so I just hard-coded it for my personal use at the moment. If you have better ways to do this, please do share. :)

#!/usr/bin/env node
var task                    = require('child_process').exec,
    fs                      = require('fs'),
    pathLib                 = require('path'),
    os                      = require('os'),
    inWindows               = (os.platform() === 'win32');

String.prototype.replaceAll = function (find, replace) {
var str = this;
return str.replace(new RegExp(find.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&'), 'g'), replace);
};

var App = function(plugin_name){
    // HCA 2014/12/08: Running as normal cordova hook (Not cocoonjs)

    // HCA 2014/12/08: Commented out as workaround to cocoonjs automated installation bug
    // if(!process.env.CORDOVA_PATH_BINARY || !process.env.CORDOVA_CUSTOM_VERSION || !process.env.CORDOVA_PLUGIN_PATH){
    //  process.exit(0);
    // }

    // HCA 2014/12/08: Assumption: "cordova" is in the PATH
    // this.CORDOVA_PATH_BINARY = new Buffer(process.env.CORDOVA_PATH_BINARY, 'base64').toString("UTF-8");
    this.CORDOVA_PATH_BINARY = "cordova";
    // HCA 2014/12/08: Assumption: Running cordova 3.6.3-0.2.13
    // this.CORDOVA_CUSTOM_VERSION = new Buffer(process.env.CORDOVA_CUSTOM_VERSION, 'base64').toString("UTF-8");    
    this.CORDOVA_CUSTOM_VERSION = '3.6.3-0.2.13';
    this.plugin_name    = plugin_name;
    // HCA 2014/12/08: Assumption: Default plugins path
    // this.plugin_path     = this.getPath(new Buffer(process.env.CORDOVA_PLUGIN_PATH, 'base64').toString("UTF-8"));
    this.plugin_path    = pathLib.join(process.cwd(), "plugins", "com.ludei.webview.plus")
    this.plugin_path_android =  pathLib.join(this.plugin_path , "android");
    console.log("Path to Webview+ Project ", this.plugin_path_android, "Plugin path", this.plugin_path);
};

App.prototype = {

    getPath : function(path){
        if(inWindows){
            return path.replaceAll('/', pathLib.sep);
        }else{
            return path;
        }
    },
    getPlugins: function(callback){
        task(this.CORDOVA_PATH_BINARY + " plugins", function (error, stdout, stderr) {
            try{
                if(error) throw new Error(stderr);
                // HCA 2014/12/08: Commented out as workaround to cocoonjs automated installation bug
                // if(this.ctx.CORDOVA_CUSTOM_VERSION >= "3.5.0-0.1.0"){
                    var tmp_list = [];
                    // Modified delimiter to \n. \\n <- Bug in cocoonjs automated installation
                    // stdout.split("\\n").forEach(function(plugin_info){
                    stdout.split("\n").forEach(function(plugin_info){
                        tmp_list.push(plugin_info.split(" ")[0]);
                    });
                    stdout = JSON.stringify(tmp_list);
                // }
                var plugins = JSON.parse(stdout.toString().replaceAll("'", '"'));
                console.log("Plugin list: ", plugins);
                if(Boolean(plugins) && Array.isArray(plugins))
                {
                    this.cllbck.call(this.ctx, plugins);
                }else{
                    this.cllbck.call(this.ctx, false);
                }
            }catch(e){

            }finally{
                process.exit(0);
            }
        }.bind({ cllbck : callback, ctx : this }));
    },
    processPlugin: function(plugins){
        for (var x = 0; x < plugins.length; x++) {
            if(plugins[x] === this.plugin_name){
                console.log("Installing Webview+");
                this.installChromium();
            }
        };
    },
    installChromium: function(){
        var CORDOVA_LIBRARY_PATH    = this.getPath("./platforms/android/libs/cordova-3.2.0.jar");
        var PROJECT_PROPERTIES_PATH = (this.CORDOVA_CUSTOM_VERSION === "3.2.0-0.1.0") ? pathLib.join(process.cwd(), "platforms", "android", "project.properties") : pathLib.join(process.cwd(), "platforms" , "android", "CordovaLib" , "project.properties");
        var CORDOVA_FRAMEWORK_WEBVIEW_PATH      = this.getPath("./platforms/android/CordovaLib/src/org/apache/cordova/CordovaWebView.java");
        var PROJECT_PROPERTIES_RELATIVE_PATH    = (this.CORDOVA_CUSTOM_VERSION === "3.2.0-0.1.0") ? process.cwd() + "/platforms/android/" : process.cwd() + "/platforms/android/CordovaLib/";
        var RELATIVE_CHROMIUM_PATH              = pathLib.relative( this.getPath(PROJECT_PROPERTIES_RELATIVE_PATH), this.getPath(this.plugin_path_android) );
        var project_properties_data             = fs.readFileSync(PROJECT_PROPERTIES_PATH);

        if( !(project_properties_data.toString('utf-8').indexOf("com.ludei.webview.plus") != -1) ){

            console.log("Adding Chromiun as a project reference into " + PROJECT_PROPERTIES_PATH, "Cordova version", this.CORDOVA_CUSTOM_VERSION);
            if(inWindows){
                RELATIVE_CHROMIUM_PATH = RELATIVE_CHROMIUM_PATH.replaceAll(pathLib.sep, '\\\\');
            }

            if(this.CORDOVA_CUSTOM_VERSION === "3.2.0-0.1.0"){
                fs.renameSync( pathLib.join( CORDOVA_LIBRARY_PATH ), pathLib.join( this.plugin_path, "resources", "cordova-3.2.0.jar") );
                fs.renameSync( pathLib.join(this.plugin_path, "resources", "cordova-ludei-framework.jar"), pathLib.join(process.cwd() , "platforms", "android", "libs", "cordova-ludei-framework.jar"));
                if(fs.existsSync(CORDOVA_LIBRARY_PATH)){
                    fs.unlinkSync(CORDOVA_LIBRARY_PATH);    
                } 
                fs.appendFileSync(PROJECT_PROPERTIES_PATH, "\nandroid.library.reference.1=" + RELATIVE_CHROMIUM_PATH.toString());
                console.log("Webview+ installed correctly.");
            }

            if(this.CORDOVA_CUSTOM_VERSION >= "3.3.0-0.1.0"){
                var cordova_webview_contents = fs.readFileSync(CORDOVA_FRAMEWORK_WEBVIEW_PATH).toString('utf-8');
                var extend_original = "public class CordovaWebView extends WebView";
                var extend_end = "import com.ludei.chromium.LudeiWebView;\n public class CordovaWebView extends LudeiWebView";

                fs.unlinkSync(CORDOVA_FRAMEWORK_WEBVIEW_PATH);
                fs.writeFileSync(CORDOVA_FRAMEWORK_WEBVIEW_PATH, cordova_webview_contents.replace(extend_original,extend_end));
                fs.appendFileSync(PROJECT_PROPERTIES_PATH, "\nandroid.library.reference.1=" + RELATIVE_CHROMIUM_PATH.toString());
                console.log("Webview+ installed correctly.");
            }

            // Change the api level to 14 if needed
            var android_manifest_path = pathLib.join( process.cwd() , "platforms", "android", "AndroidManifest.xml");
            if(fs.existsSync(android_manifest_path)){
                var manifest_data = fs.readFileSync(android_manifest_path).toString("utf8");
                var manigest_reg_exp = /android:minSdkVersion="([^"]*)"/i;
                var result = manifest_data.match(manigest_reg_exp);
                if(result[1]){
                    var android_api_level = parseInt(result[1]);
                    if( android_api_level < 14 ){
                        manifest_data = manifest_data.replace(manigest_reg_exp, 'android:targetSdkVersion="14"');
                        fs.writeFileSync(android_manifest_path, manifest_data, 'utf8');
                    }
                }
            }else{
                console.error("Cannot locate Android Manifest");
            }

        }else{
            console.log("Webview+ is already installed in the project.");
        }

        console.log("Hook execution finished.");
        process.exit(0);
    }
}

var cocoon_app = new App('com.ludei.webview.plus');

console.log("=====================================================================");
console.log("=====================================================================");
console.log("Adding WebView+ plugin...");

cocoon_app.getPlugins(function(plugins){
    if(plugins){
        this.processPlugin(plugins);
        console.log("Added WebView+ plugin.");
    }else{
        console.log("No plugins found on the Webview+ hook");
        process.exit(0);
    }
});