2012-08-01 142 views
5

我正在嘗試使用可以使用iframe測試任何網站的Node.js進行黃瓜測試設置。 由於跨腳本安全限制,通常iframe是不合格的。 但是,如果可能的話(我敢肯定它是這樣的,而且我相信你會想出一個解決方案) 在請求特定的url名稱時通過請求的url獲取測試的目標網站,這樣iframe將加載測試目標的副本。 基本上只是一個標準的node.js服務器,它基於類似於地址請求路由器的req.url 來獲取特定的頁面。通過Node.js路由http請求

這是我公然的嘗試做到這一點。 通過提取測試頁面。該網址的作品。 但我有一個問題,從http服務器切換到連接對象。 有沒有辦法「喂」與http服務器響應的連接?

PS。我還用兩個node.js服務器創建了一個解決方案。 節點1獲取測試目標並將其與黃瓜測試頁面混合。 節點2主持黃瓜測試。 此解決方案正在運行。但它會在發生JavaScript命名衝突的網站上產生問題。這就是爲什麼通過封裝解決這個問題的iframe解決方案更具吸引力。

var http = require('http'); 
var connect = require('connect'); 
var port = process.env.PORT || 8788; 

var server = http.createServer(function(req, webres) 
{ 
    var url = req.url; 
    console.log(url); 

    if(url == '/myWebsiteToBeTestedWithCucumberJS') 
    { 
     // Load the web site to be tested "myWebsiteToBeTestedWithCucumberJS" 
      // And update the references 
      // Finaly write the page with the webres 
      // The page will appear to be hosted locally 

     console.log('Loading myWebsiteToBeTestedWithCucumberJS'); 
     webres.writeHead(200, {'content-type': 'text/html, level=1'}); 
     var options = 
     { 
        host: 'www.myWebsiteToBeTestedWithCucumberJS.com, 
        port: 80, 
        path: '/' 
     }; 

     var page = ''; 
     var req = http.get(options, function(res) 
     { 
      console.log("Got response: " + res.statusCode); 
      res.on('data', function(chunk) 
      { 
       page = page + chunk; 
      }); 
      res.on('end', function() 
      { 
        // Change relative paths to absolute (actual web location where images, javascript and stylesheets is placed) 
        page = page.replace(/ href="\/\//g  , ' href="/'); 
        page = page.replace(/ src="\//g   , ' src="www.myWebsiteToBeTestedWithCucumberJS.com'); 
        page = page.replace(/ data-src="\//g  , ' data-src="www.myWebsiteToBeTestedWithCucumberJS.com'); 
        page = page.replace(/ href="\//g   , ' href="www.myWebsiteToBeTestedWithCucumberJS.com'); 

        webres.write(page); 
        webres.end(''); 
      }); 
     }); 
    } 
    else 
    { 
     // Load any file from localhost:8788 
      // This is where the cucumber.js project files are hosted 
     var dirserver  = connect.createServer(); 
     var browserify = require('browserify'); 
     var cukeBundle = browserify({ 
      mount: '/cucumber.js', 
      require: ['cucumber-html', './lib/cucumber', 'gherkin/lib/gherkin/lexer/en'], 
      ignore: ['./cucumber/cli', 'connect'] 
     }); 
     dirserver.use(connect.static(__dirname)); 
     dirserver.use(cukeBundle); 
     dirserver.listen(port); 
    } 
}).on('error', function(e) 
{ 
     console.log("Got error: " + e.message); 
}); 
server.listen(port); 
console.log('Accepting connections on port ' + port + '...'); 

回答

3

好吧,畢竟它不是那麼難。
作爲node.js的新手,我必須意識到使用多個監聽器的可能性。
閱讀nodejitsu的功能幫助我解決了這個問題。 http://localhost:9788/myWebsiteToBeTestedWithCucumberJS 其中作爲cucumber.js網站要求所有其他請求被處理:

下面的例子指定URL時,如下加載www.myWebsiteToBeTestedWithCucumberJS.com 。
希望這對其他node.js newcucumbers有意義。

var http = require('http'); 

var connect = require('connect'); 
var port = process.env.PORT || 9788; 

var server = http.createServer(function(req, webres) 
{ 
    var url = req.url; 
    console.log(url); 
    if(url == '/myWebsiteToBeTestedWithCucumberJS') 
    { 
     loadMyWebsiteToBeTestedWithCucumberJS(req, webres); 
    } 
    else 
    { 
     loadLocal(req, webres, url); 
    } 
}).on('error', function(e) 
{ 
     console.log("Got error: " + e.message); 
}); 
server.listen(port); 
console.log('Accepting connections on port ' + port + '...'); 

function loadMyWebsiteToBeTestedWithCucumberJS(req, webres) 
{ 
    console.log('Loading myWebsiteToBeTestedWithCucumberJS'); 
    webres.writeHead(200, {'content-type': 'text/html, level=1'}); 
    var options = 
    { 
       host: 'www.myWebsiteToBeTestedWithCucumberJS.com', 
       port: 80, 
       path: '/' 
    }; 

    var page = ''; 
    var req = http.get(options, function(res) 
    { 
     console.log("Got response: " + res.statusCode); 
     res.on('data', function(chunk) 
     { 
      page = page + chunk; 
     }); 
     res.on('end', function() 
     { 
       page = page.replace(/ href="\/\//g  , ' href="/'); 
       page = page.replace(/ src="\//g   , ' src="http://www.myWebsiteToBeTestedWithCucumberJS.com/'); 
       page = page.replace(/ data-src="\//g  , ' data-src="http://www.myWebsiteToBeTestedWithCucumberJS.com/'); 
       page = page.replace(/ href="\//g   , ' href="http://www.myWebsiteToBeTestedWithCucumberJS.com/'); 

       webres.write(page); 
       webres.end(''); 
     }); 
    }); 

} 

function loadLocal(req, webres, path) 
{ 
    console.log('Loading localhost'); 
    webres.writeHead(200, {'content-type': 'text/html, level=1'}); 
    var options = 
    { 
       host: 'localhost', 
       port: 9787, 
       path: path 
    }; 

    var page = ''; 
    var req = http.get(options, function(res) 
    { 
     console.log("Got response: " + res.statusCode); 
     res.on('data', function(chunk) 
     { 
      page = page + chunk; 
     }); 
     res.on('end', function() 
     { 
       webres.write(page); 
       webres.end(''); 
     }); 
    }); 
} 


// Cucumber site listening on port 9787 
var dirserver  = connect.createServer(); 
var browserify = require('browserify'); 
var cukeBundle = browserify(
{ 
    mount: '/cucumber.js', 
    require: ['cucumber-html', './lib/cucumber', 'gherkin/lib/gherkin/lexer/en'], 
    ignore: ['./cucumber/cli', 'connect'] 
}); 
dirserver.use(connect.static(__dirname)); 
dirserver.use(cukeBundle); 
dirserver.listen(9787); 
+0

作爲一個方面說明,我可以推薦你看看Cukestall(https://github.com/jbpros/cukestall)。這是Cucumber.js潛在的官方「iframe亞軍」。它旨在測試一個* local * Node.js應用程序。但是,在* remote *應用程序上運行和加載功能套件應該相當容易。 – jbpros 2012-08-02 07:31:53

+0

對「loadMyWebsiteToBeTestedWithCucumberJS」函數名稱有一個贊成 – 2016-03-10 20:17:36