moxiecode / moxie

Pollyfills for XHR2 and File API
GNU Affero General Public License v3.0
483 stars 134 forks source link

mOxie namespace gone? v1.5.3 #171

Open JohnRSim opened 7 years ago

JohnRSim commented 7 years ago

Tried to use https://github.com/moxiecode/moxie/blob/master/src/javascript/o.js to bring int he namespace but getting the following error

o.js:23 Uncaught TypeError: Cannot read property 'core' of undefined at o.js:23

Simple example - also tried shim within config requirejs.

require(['/moxie.dev.js'],function() {
    require(['/o.js'],function() {
        var test2 = mOxie.FileDrop('test');
    });
});

Whats the new approach of using mOxie without plupload?

JohnRSim commented 7 years ago

Anyone else had this or do I just bring in plupload and moxie can no longer be run standalone?

jayarjo commented 7 years ago

You could include those files directly. Or simply use moxie namespace.

Maybe I should make o.js importable. But currently it is not compatible with non-global moxie namespace.

JohnRSim commented 7 years ago

Let me try moxie I thought I had tried that and it hadn't worked either. Without the plupload scripts

jayarjo commented 7 years ago

moxie namespace is structured differently, so to access FileDrop for example, use absolute name - moxie.file.FileDrop.

JohnRSim commented 7 years ago

@jayarjo if I do the following I'm getting undefined for moxie as well. Without importing the plupload libs.

require(['/moxie.min.js'],function() {
    console.log(moxie); //undefined
});
require(['/moxie.min.js'],function(moxie) {
    console.log(moxie); //undefined
});

The moxie lib is being imported. image

I don't see any moxie in window namespace either.

JohnRSim commented 7 years ago

if I just add the following in a blank html template

<script src="lib/moxie/js/moxie.min.js"></script> 

Without using require within a html file then moxie namespace is available.

Thanks J.

jayarjo commented 7 years ago

You do not need to get fancy there. Simple:

require(['moxie'], function(moxie) {
    console.log(moxie);
});

should do the thing.

Or even:

import moxie from 'moxie';

if your environment is ready.

JohnRSim commented 7 years ago

That's what I thought but if I strip everything right down and do this as a basic example/test - moxie is still undefined - I can see it is loaded within the head tags.

//this is shown in the html head after the page loads -
<script type="text/javascript" charset="utf-8" async="" data-requirecontext="_" data-requiremodule="lib/moxie/js/moxie.min.js" src="lib/moxie/js/moxie.min.js"></script>

This is the test I'm using stripped down:

<!doctype html>
<html class="no-js" lang="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title></title>
</head>
<body>

    <script src="../../../lib/requirejs/require.min.js"></script>
    <script>
    require(['lib/moxie/js/moxie.min.js'], function(moxie) {
        console.log(moxie);
    });
    </script>
</body>
</html>

window.moxie also does not exist? If I try to search for it in the console.

jayarjo commented 7 years ago

Sorry I had an impression that you were using Webpack. I've never used RequireJS, so can't help you there. It might be that mOxie is not even compatible with it, unless it auto-magically follows the same conventions.

window.moxie will be available if you include moxie directly in a non-AMD environment.

jayarjo commented 7 years ago

I think what you were lacking was proper config. This worked fine for example:

<!doctype html>
<html class="no-js" lang="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <title></title>
</head>
<body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script>
    <script>
        require.config({
            baseUrl: "lib",
            paths: {
                "moxie": "mOxie/bin/js/moxie.min"
            }
        });

        require(['moxie'], function(moxie) {
            console.log(moxie);
        });
    </script>
</body>
</html>

Be sure to adjust config to your local paths.

JohnRSim commented 7 years ago

ahh ;) - it used to work - as I used it with requirejs in v1.2.1 - but when I upgraded to latest release it broke.

jayarjo commented 7 years ago

It might be that RequireJS was simply loading the script. mOxie, just as plupload were not properly encapsulated, so should have leaked namespaces to global environment. We had multiple complaints about this, so we "fixed" it.

Try the config above, it worked for me.

JohnRSim commented 7 years ago

Yup - the above worked for me... Strange.. I was playing around if I use the name to load it in it works as you show - but if I define the path in require it doesn't ie.

ie Failed path entry

require(['moxie/js/moxie.min'], function(moxie) {
    console.log(moxie);
});

Worked - config name entry

require(['moxie'], function(moxie) {
    console.log(moxie);
});
jayarjo commented 7 years ago

Internally the module is defined as moxie, so fancy stuff like absolute path will fail. That might explain this.