如何使用JSDom包装导入？

Question

我有一个使用ES2015模块语法的代码库，即。 import foo from 'bar'。它也有这样的代码：

// setup.js 
var foo = window.foo || ''; 

我想用jsdom为我的测试环境提供了一个模拟的DOM，但我无法弄清楚如何换我导入的代码。该import语句来任何代码之前，所以我不能做到这一点：

import jsdom; 

jsdom({ 
    html: '<div></div>', 
    done:() => { 
     import setup from 'setup'; 
    } 
}) 

但是如果我离开进口在顶部，属于它的地方，window引用之前jsdom可以参与：

import foo from 'bar'; // this uses the DOM 
import jsdom; 

jsdom({ 
    html: '<div></div>', 
    done:() =>() => { console.log('foo'); } 
}) 

有什么办法可以解决这个问题，而不需要改用AMD或CommonJS？

Answer 1

所以事实证明，我只是需要阅读规范...或在我的情况下，一个辉煌的博客，打破了我的规范（谢谢②ality！）的确，你不能import foo from 'bar'函数内，但事实证明，这不是ES6中import的唯一途径。还有System.import ...

jsdom.env({ 
    html: '<div></div>', 
    done:() => { 
     System.import('setup') 
      .then(setup) => { 
       // code that uses setup, now JSDom-wrapped 
    } 
}); 

请注意，如果你正在做的这一切都通过一个测试运行像摩卡运行代码，你需要告知你的测试运行做一个异步等待负载。换句话说（对于摩卡），您需要使用done参数，如下所示：

jsdom.env({ 
    html: '<div></div>', 
    done:() => { 
     describe('foo',() => { 
      it('does something', (done) => { 
       System.import('setup') 
        .then(setup) => { 
         // code that uses setup, now JSDom-wrapped 
         done(); // tell Mocha we're finished 
        }); 
      }); 
     }); 
    }); 
});