2012-06-26 33 views
6

mã trong main.js tập tin là như thế này:phantomjs và requirejs

 phantom.injectJs("libs/require-1.0.7.js"); 
     require.config(
     { 
      baseUrl: "" 
     } 
    ); 
     require([], function(){}); 

khi tôi chạy "phantomjs main.js" trong dòng lệnh, requirejs không hoạt động tốt trong main.js. Tôi biết làm thế nào để sử dụng requirejs trong trang chạy trong trình duyệt (bao gồm cả phantomjs 'cách: page.open (url, gọi lại)), nhưng không giống như ở trên. Tôi cố gắng sử dụng requirejs như main.js, nó là một vấn đề phổ biến, tôi nghĩ vậy. Cảm ơn bạn!

+0

Bạn đã bao giờ con số này ra? –

+0

Tôi có thêm một chút ... bạn có thể truy cập vào các yêu cầu thực tế yêu cầu biến như sau: yêu cầu = null; phantom.injectJs ('target/dependencies/requirejs-tar.gz/require.js'); –

+0

@Thomas, tôi sẽ cố gắng theo cách của bạn, :) – user1395927

Trả lời

1

bạn đang hiểu nhầm webpage.injectJs()

nó cho tiêm script vào trang web mà bạn đang tải, không vào môi trường phantomjs runtime.

Vì vậy, sử dụng .injectJs() đang yêu cầu tải lên trang của bạn, không phải vào phantomjs.exe.

Điều đó nói rằng, môi trường thời gian chạy của phantomjs có một số ước lượng của commonjs. RequireJs sẽ không chạy trên đó theo mặc định. Nếu bạn cảm thấy đặc biệt (VERY) có động lực, bạn có thể cố gắng chuyển yêu cầu-shim được thực hiện cho nodejs, nhưng nó không làm việc ra khỏi hộp, và sẽ đòi hỏi một sự hiểu biết sâu sắc vô cùng của các runtimes. để biết thêm chi tiết: http://requirejs.org/docs/node.html

ý tưởng hay hơn: có thể bạn nên đảm bảo bạn có phiên bản Javascript phổ biến mà bạn muốn chạy. cá nhân tôi viết mã của tôi trong bản đánh số để tôi có thể xây dựng cho cả commonjs hoặc amd. tôi sử dụng commonjs cho mã phantomjs, và amd cho nodejs và trình duyệt.

2

Tôi vừa vật lộn một thời gian. Giải pháp của tôi không sạch sẽ, nhưng nó hoạt động, và tôi hài lòng với điều đó do tài liệu api chưa hoàn thành từ các phantomj.

Giải thích từ vựng

Bạn cần ba tệp. Một là tệp thử nghiệm phantomjs amd mà tôi sẽ gọi là "amd.js". Thứ hai là trang html của bạn để tải mà tôi sẽ đặt tên là "amd.html". Cuối cùng, kiểm tra trình duyệt mà tôi gọi là "amdTestModule.js".

Trong amd.html, kê khai thẻ script của bạn mỗi bình thường:

<script data-main="amdTestModule.js" src="require.js"></script> 

Trong tập tin thử nghiệm phantomjs của bạn, đây là nơi mà nó được hacky. Tạo trang của bạn và tải trong mô-đun 'fs'. Điều này cho phép bạn mở đường dẫn tệp tương đối.

var page = require('webpage').create(); 
var fs = require('fs'); 

page.open('file://' + fs.absolute('tests/amd.html')); 

Bây giờ vì requirejs tải tệp không đồng bộ, chúng tôi không thể chuyển qua gọi lại vào trang.open và mong đợi mọi thứ diễn ra suôn sẻ. Chúng tôi cần một số cách để
1) Kiểm tra mô-đun của chúng tôi trong trình duyệt và truyền đạt kết quả về ngữ cảnh ảo của chúng tôi. Hoặc
2) Thông báo cho ngữ cảnh ảo của chúng tôi rằng khi tải tất cả các tài nguyên, để chạy thử nghiệm.

# 1 đơn giản hơn cho trường hợp của tôi. Tôi đã thực hiện điều này qua:

page.onConsoleMessage = function(msg) { 
    msg = msg.split('='); 
    if (msg[1] === 'success') { 
     console.log('amd test successful'); 
    } else { 
     console.log('amd test failed'); 
    } 
    phantom.exit(); 
}; 

** Xem mã đầy đủ bên dưới cho thông điệp console.log của tôi.

Bây giờ, các ma ảo dường như có api sự kiện được tích hợp nhưng không có giấy tờ. Tôi cũng đã có thể nhận được thông báo yêu cầu/phản hồi từ trang page.onResourceReceived và page của họ.onResourceRequested - có nghĩa là bạn có thể gỡ lỗi khi tất cả các mô đun cần thiết của bạn được tải. Tuy nhiên, để giao tiếp kết quả thử nghiệm của tôi, tôi chỉ sử dụng console.log.

Điều gì sẽ xảy ra nếu thông báo console.log không bao giờ chạy? Cách duy nhất tôi có thể nghĩ đến việc giải quyết vấn đề này là sử dụng setTimeout

setTimeout(function() { 
    console.log('amd test failed - timeout'); 
    phantom.exit(); 
}, 500); 

Điều đó sẽ thực hiện!

Full Mã

cấu trúc thư mục

/projectRoot 
    /tests 
    - amd.js 
    - amdTestModule.js 
    - amd.html 
    - require.js (which I symlinked) 
    - <dependencies> (also symlinked) 

amd.js

'use strict'; 
var page = require('webpage').create(); 
var fs = require('fs'); 

/* 
page.onResourceRequested = function(req) { 
    console.log('\n'); 
    console.log('REQUEST'); 
    console.log(JSON.stringify(req, null, 4)); 
    console.log('\n'); 
}; 
page.onResourceReceived = function(response) { 
    console.log('\n'); 
    console.log('RESPONSE'); 
    console.log('Response (#' + response.id + ', stage "' + response.stage + '"): ' + JSON.stringify(response, null, 4)); 
    console.log('\n'); 
}; 
*/ 

page.onConsoleMessage = function(msg) { 
    msg = msg.split('='); 
    if (msg[1] === 'success') { 
     console.log('amd test successful'); 
    } else { 
     console.log('amd test failed'); 
    } 
    phantom.exit(); 
}; 

page.open('file://' + fs.absolute('tests/amd.html')); 

setTimeout(function() { 
    console.log('amd test failed - timeout'); 
    phantom.exit(); 
}, 500); 

amd.html

<!DOCTYPE html> 
<html> 

<head> 
    <meta charset="UTF-8"> 
</head> 

<body> 
    <script data-main='amdTestModule.js' src='require.js'></script> 
</body> 

</html> 

amdTestModule.js

require([<dependencies>], function(<dependencies>) { 
    ... 
    console.log(
     (<test>) ? "test=success" : "test=failed" 
    ); 
}); 

console

$ phantomjs tests/amd.js 
amd test successful