2015-12-22 8 views
7

Ho webfontloader che funziona bene all'interno di un contesto del browser. Ora sto cercando di capire se riesco a farlo funzionare in un contesto node.js + jsdom, in particolare poiché webfontloader è disponibile come npm module.Come webfontloader per funzionare con node.js e jsdom

Ho nodo + jsdom che lavora per fornire un output ragionevole, quindi so che la parte sta funzionando. Ma quando provo ad integrare webfontloader, per abilitare i caratteri web, mi sblocco.

Fondamentalmente sto usando il modulo webfontloader come documentato nel file README, che è:

var WebFont = require('webfontloader'); 

WebFont.load({ 
    google: { 
    families: ['Droid Sans', 'Droid Serif'] 
    } 
}); 

Ma per quanto posso, ottengo il seguente errore:

ReferenceError: window is not defined

posso ottenere un window oggetto da jsdom:

  // Get the document and window 
      var doc = jsdom.jsdom('<!doctype html><html><body><div id="container"></div></body></html>'), 
       win = doc.defaultView; 

Ma come faccio a passare win in to webfontloader per l'uso come window in quel contesto?

Forse sto mostrando la mia ingenuità e chiedo l'impossibile.

+0

Hai provato il caricamento del WebFont all'interno del jsdom.env (....) contesto? –

+0

Hai provato la risposta qui sotto? – cviejo

+0

Non ancora. Spiacente, non ho ancora avuto una possibilità. Tuttavia sembra tutto plausibile, e non vedo l'ora di provarlo. Grazie per la risposta dettagliata. – drmrbrewer

risposta

1

Se non avete una buona ragione per non farlo, preferirei consiglio di caricare webfontloader in jsdom con jsdom.env o jsdom.jsdom, sia utilizzando il version ospitato su Google Hosted biblioteche o ospitare da soli. Utilizzando jsdom.env sarebbe simile a questa:

var jsdom = require("jsdom"); 

jsdom.env( 
    '<!doctype html><html><body></body></html>', 
    ['https://ajax.googleapis.com/ajax/libs/webfont/1.5.18/webfont.js'], 
    function(err, win) { 

     var WebFont = win.WebFont; 

     WebFont.load({ 
      google: { 
       families: ['Droid Sans', 'Droid Serif'] 
      } 
     }); 
    } 
); 

Se avete veramente bisogno di richiedere webfontloader da un contesto nodejs, per quanto posso dire webfontloader non può essere passato una finestra come parametro, ma si può aggirare questo facilmente aggiungendo un paio di righe alla libreria.

  1. Run npm install webfontloader
  2. Open "node_modules/webfontloader/webfontloader.js"
  3. Racchiudere il contenuto di "webfontloader.js" in una funzione module.exports che prende un oggetto window come parametro.

Il file potrebbe essere simile a questo (non incollare tutta la sorgente della libreria webfontloader):

module.exports = function(window){ 

    var exportsBackup = module.exports; 

    /* Web Font Loader v1.6.16 - (c) Adobe Systems, Google. License: Apache 2.0 */ 
    (function(){function aa(a,b,c){r ... 

    var loaderObject = module.exports; 
    module.exports = exportsBackup; 

    return loaderObject; 
}; 

Io memorizzare temporaneamente module.exports in una variabile per assicurarci di poter richiedere il modulo in questo modo più volte , poiché la libreria webfontloader sostituirà l'oggetto module.exports.

È possibile richiedere la libreria come questo senza errori:

var jsdom = require("jsdom"); 

jsdom.env("https://nodejs.org/", [], function(err, win) { 

    var WebFont = require('webfontloader')(win); 

    WebFont.load({ 
     google: { 
      families: ['Droid Sans', 'Droid Serif'] 
     } 
    }); 

}); 
+0

Utilizzando il furbo suggerimento di modificare 'webfontloader.js' per abilitare il passaggio di 'window' come parametro, ora riesco ad arrivare alla funzione' WebFont.load() 'senza l'errore Reference. Ma ora sto ottenendo esattamente lo stesso problema descritto qui: http://stackoverflow.com/q/34163339/4070848 - in altre parole, il tentativo di caricamento di webfont raggiunge sempre il ramo 'inattivo' e non carica mai correttamente . Sei in grado di far caricare un webfont con 'jsdom'? E ho provato a passare un 'userAgent' personalizzato a' jsdom' per cercare di ingannare webfontloader, inutilmente. – drmrbrewer

+0

Ok, darò un'occhiata in. Ma prima, buon anno! – cviejo

+0

Buon anno (quasi!) Pure ... alcuni sono nel nuovo anno, altri non del tutto! – drmrbrewer

Problemi correlati