Thủ Thuật Các lệnh trong javascrip

[stronglives99]

Bạn đang muốn tìm hiểu về các câu lệnh trong javacsrip? Hãy tìm hiểu trong bài viết dưới đây chắc chắn sẽ giải đáp được những khó khăn của bạn. Cùng đón xem nhé!

1. Cách dùng Javascripts dạng scripts trong selenium IDE

Một vài câu lệnh trong selenium, tham số đầu vào của lệnh chỉ định một đoạn kịch bản JS như là assertEval, verifyEval, storeEval, và waitForEval. Tham số này không cần cú pháp gì đặc biệt. Người dùng chỉ việc đặt một đoạn mã JS vào phần Target ( do cú pháp trong câu lệnh của selenium thường lấy Target là tham số đầu tiên)

Tất cả các biến được create trong case thử nghiệm của bạn được lưu trữ trong

JavaScript là một mảng kết hợp. Nhưng mảng này chỉ có chuỗi ký tự, không dùng chỉ mục.

Bất cứ khi nào bạn muốn truy cập hay thao tác với một biến trong một đoạn mã JavaScript, bạn phải đề cập đến nó như storedVars ['tên biến của bạn'].

1.1: Câu lệnh assertEval, verifyEval

verifyEval : Câu lệnh rất hữu ích khi compare hai value hoặc chuỗi đặc biệt, khi compare kết quả của kịch bản với các value được lưu trữ trong biến.

store_value_edit-300x247.png

Trong vdu trên, đã compare value (5) được lưu trữ trong biến "Test1" với kết quả của javascript {2 +3}. Nó sẽ cho kết quả đúng vì 5 = javascript {2 + 3}.

AssertEval: Làm việc tương tự như "verifyEval" nhưng sẽ ngừng thực hiện nếu thất bại. Trong vdu trên, "assertEval" sẽ thất bại vì chuỗi "1234" sẽ không thích hợp với chuỗi "123"

vdu tiếp theo minh họa cách một đoạn mã JavaScript có thể biến đổi dữ liệu văn bản từ lowcase thành chữ hoa và từ chữ hoa thành chuỗi văn bản lowcase , case này ta sẽ phải dùng 2 phương thứ toUpperCase method và toLowerCase của đối tượng String.

chu_hoa_edit-300x235.png

[info] Executing: |store | Selenium IDE | name |
[info] Executing: |storeEval | storedVars['name'].toUpperCase() | Chuhoa |
[info] script is: storedVars['name'].toUpperCase()
[info] Executing: |echo | $$Chuhoa} | |
[info] echo: SELENIUM IDE
[info] Executing: |storeEval | storedVars['name'].toLowerCase() | Chuthuong |
[info] script is: storedVars['name'].toLowerCase()
[info] Executing: |echo | $$Chuthuong} | |
[info] echo: selenium ide
Như các bạn thấy kết quả của đoạn script ở trên chuỗi "Selenium IDE" đã được chuyển thành chữ in hoa sau khi kết thúc phương thức toUpperCase() và chuyển thành lowcase sau khi kết thúc phương thức toLowerCase()

2. Cách dùng Javascripts dạng Non-scripts

JavaScript cũng có thể được dùng để giúp create value cho các tham số trong lệnh của selenium. Tuy nhiên trong case này cú pháp sẽ đặc biệt hơn chút. Tất cả các đoạn mã Javascript sẽ được đặt trong dấu { } và phía trước có nhãn javascript.

Cú pháp: javascript{mã js của bạn ở đây}

Dưới đây là một vdu về cách dùng javascript dạng non-script

non_script-300x229.png

Kết quả của đoạn script trên

[info] Executing: |store | 20.05 | number1 |
[info] Executing: |store | 30.023 | number2 |
[info] Executing: |echo | javascript{parseInt(storedVars['number1'])+parseInt(storedVars['number2'])} | |
[info] echo: 50
Trong vdu trên đã dùng hàm parseInt("chuỗi"): biến chuỗi thành số nguyên của ngôn ngữ javascript

Selenium có một lệnh đơn giản cho phép bạn in ra value đầu ra của js đó là lệnh echo. Nó rất hữu ích cho việc cung cấp thông tin trong quá trình phát triển kịch bản của bạn. Nó sẽ in value trong cửa sổ Log trong quá trình chạy. Nó sẽ giúp tìm ra được các vấn đề tồn tại ẩn trong kịch bản như sai sót về thuật toán hoặc sự nhầm lần trong việc tính toán dựa vào công thức trong mã javascript.

** 3. Xử lý JavaScript Alerts**

Selenium IDE không hỗ trợ ghi trên cửa sổ pop-up do khi một của sổ mới được mở ra nó sẽ không nằm trong thẻ body của cửa sổ chính nơi bạn đang làm việc. Selenium IDE, Dom và những plugin khác của Firefox cũng không làm việc. Do đó bạn phải thao tác bằng tay để ghi lại những sự kiện của bạn trên cửa sổ pop-up này.

Có nhiều cách khác nhau để giải quyết với các loại cửa sổ pop up khác nhau. Sau đây là một số cách dùng để xử lý JavaScript Alerts.

selenium.chooseCancelOnNextConfirmation()

selenium.chooseOkOnNextConfirmation()

Hai lệnh này sẽ được dùng khi hành động của bạn sẽ tạo nên một cảnh báo. vdu khi bạn xóa một đối tượng nào đó sẽ có một cảnh báo bằng js hiện lên với target giúp bạn cân nhắc việc có chắc chắn xóa nó không. Cửa sổ này sẽ có hai lựa chọn là “OK” và “Cancel”.

Với case bạn đồng ý xóa thì lệnh selenium.chooseOkOnNextConfirmation() được cài là mặc định. Ngược lại khi bạn muốn thoát khỏi việc xóa đối tượng này. Bạn sẽ phải bấm vào nút Cancel tuy nhiên Selenium sẽ không hỗ trợ việc này mà bạn phải tự điền lệnh selenium.chooseCancelOnNextConfirmation() trước lệnh xóa.

selenium.chooseCancelOnNextConfirmation()

selenium.click(buttonLocator)

4. Lệnh runScript

Trong selenium IDE "runscript" là lệnh có thể được dùng cho các target khác nhau trong điều kiện khác nhau. Bạn có thể dùng nó để chạy bất kỳ kịch bản javascript trong selenium IDE.

Cú pháp: runScript(script)

script - là các đoạn mã JavaScript để chạy

Khi chạy lệnh này sẽ create một thẻ script mới trong body của cửa sổ kiểm tra hiện tại. Kịch bản chạy theo cách này thường có thể được sửa lỗi dễ dàng hơn cách dùng các kịch bản thực hiện lệnh "getEval" của Selenium. Ghi chú JS case ngoại lệ ném vào các thẻ script không được quản lý bởi Selenium, vì vậy nên viết kịch bản của bạn trong khối try / catch.

Để hiểu rõ hơn về lệnh này mình sẽ demo một vdu về việc thay đổi tiêu đề trang bằng cách dùng lệnh "runscript" . Chạy vdu dưới đây được và nhìn vào tiêu đề trang khi script chạy hoàn chỉnh.

script_run-300x254.png

vdu trên sẽ thay đổi tiêu đề trang từ 'Only Testing: Table' thành 'New Page Title'.

5. Sử dụng User-Extensions.js

5.1: Cách tạo và dùng tệp tin user-extensions.js

Bạn có thể dùng một trình soạn thảo bất kỳ như notepad để mở một tệp tin mới và lưu nó lại dưới dạng mở rộng là .js . Để dùng được nó bạn mở selenium IDE từ menu bar chọn Options/Options... và cài đặt theo hình dưới đây.

user_extention-255x300.png

Trong mục [Selenium core extensions(user-extention.js] chọn một file js đã tạo . Sau đó khởi động lại selenium IDE .

5.2: Cách định nghĩa một hàm mới trong user-extensions.js

Mở tệp tin user-extensions.js vừa tạo trước đó và viết một đoạn mã js như sau

Selenium.prototype.doHelloWorld = function() {

alert(“Hello world !”);

}

Sau đó lưu lại tệp tin này và khởi động lại selenium của bạn. Kết quả sẽ có một hàm mới được liệt kê trong list các lệnh của selenium IDE với tên goi là helloworld. Khi chạy lệnh này mà nó bật lên một pop-up với nội dung là Hello world ! thì đã thành công trong việc tạo một lệnh mới có thể dùng được trong selenium IDE

6: Sử dụng vòng lặp "while" và "endWhile"

Làm thế nào để dùng lệnh "while" và "endWhile" lệnh trong selenium IDE ? đó là câu hỏi chúng ta đặt ra trong phần này. Lệnh "while" mặc định không được hỗ trợ trong selenium IDE. Selenium IDE cũng không hỗ trợ bất kỳ biểu thưc điều kiện nào (cả lệnh if). Vòng lặp "while" là một tính năng nâng cao của Selenium IDE. Để dùng nó bạn cần phải đính kèm user-extensions.js

Copy đoạn code dưới đây vào trình soạn thảo notepad và lưu tập tin có đuôi .js

var gotoLabels= {};

var whileLabels = {};

Selenium.prototype.reset = function() {

this.initialiseLabels();

this.defaultTimeout =

Selenium.DEFAULT_TIMEOUT;

this.browserbot.selectWindow("null");

this.browserbot.resetPopups();

}

Selenium.prototype.initialiseLabels = function()

{

gotoLabels = {};

whileLabels = { ends: {}, whiles: {} };

var command_rows = [];

var numCommands = testCase.commands.length;

for (var i = 0; i < numCommands; ++i) {

var x = testCase.commands;

command_rows.push(x);

}

var cycles = [];

var forEachCmds = [];

for( var i = 0; i < command_rows.length; i++ ) {

if (command_rows.type == 'command')

switch( command_rows.command.toLowerCase() ) {

case "label":

gotoLabels[ command_rows.target ] = i;

break;

case "while":

case "endwhile":

cycles.push( [command_rows.command.toLowerCase(), i] )

break;

case "foreach":

case "endforeach":

forEachCmds.push( [command_rows.command.toLowerCase(), i] )

break;

}

}

var i = 0;

while( cycles.length ) {

if( i >= cycles.length ) {

throw new Error( "non-matching while/endWhile found" );

}

switch( cycles[0] ) {

case "while":

if( ( i+1 < cycles.length ) && ( "endwhile" == cycles[i+1][0] ) ) {

whileLabels.ends[ cycles[i+1][1] ] = cycles[1];

whileLabels.whiles[ cycles[1] ] = cycles[i+1][1];

cycles.splice( i, 2 );

i = 0;

} else ++i;

break;

case "endwhile":

++i;

break;

}

}

}

Selenium.prototype.continueFromRow = function( row_num ) {

if(row_num == undefined || row_num == null || row_num < 0) {

throw new Error( "Invalid row_num specified." );

}

testCase.debugContext.debugIndex = row_num; }

Selenium.prototype.doLabel = function(){};

Selenium.prototype.doGotoLabel = function( label ) {

if( undefined == gotoLabels[label] ) {

throw new Error( "Specified label '" + label + "' is not found." );

}

this.continueFromRow( gotoLabels[ label ] );

};

Selenium.prototype.doGoto = Selenium.prototype.doGotoLabel;

Selenium.prototype.doGotoIf = function( condition, label ) {

if( eval(condition) ) this.doGotoLabel( label );

}

Selenium.prototype.doWhile = function( condition ) {

if( !eval(condition) ) {

var last_row = testCase.debugContext.debugIndex;

var end_while_row = whileLabels.whiles[ last_row ];

if( undefined == end_while_row ) throw new Error( "Corresponding 'endWhile' is not found." );

this.continueFromRow( end_while_row );

}

}

Selenium.prototype.doEndWhile = function() {

var last_row = testCase.debugContext.debugIndex;

var while_row = whileLabels.ends[ last_row ] - 1;

if( undefined == while_row ) throw new Error( "Corresponding 'While' is not found." );

this.continueFromRow( while_row );

}

Selenium.prototype.doPush= function(value, varName) {

if(!storedVars[varName]) {

storedVars[varName] = new Array();

}

if(typeof storedVars[varName] !== 'object') { throw new Error("Cannot push value onto non-array " + varName);

}

else { storedVars[varName].push(value);

}

}

Mở selenium IDE từ menu bar chọn Options/Options... và cài đặt như trong mục 5.1 đã hướng dẫn.

vdu minh họa dùng while và end while

ưwhile-300x268.png

Trong vdu trên nhìn vào thứ tự thực hiện của các dòng lệnh ta thấy . Vòng lặp while sẽ chạy 3 lần mỗi lần sẽ thực hiện các lệnh giữa "while" và "endWhile". Cú pháp, "storedVars.MyVar <= 3, lệnh "while" sẽ kiểm tra value của "MyVar" và tiếp tục chạy cho đến khi <= 3. Javascript ("javascript {storedVars.MyVar ++;}") sẽ làm tăng value của biến "MyVar" lên 1 sau mỗi vòng lặp. Trên kịch bản sẽ làm sáng logo của selenium 3 lần.

4. Video minh họa vdu cơ bản dùng javascript.

Trong video này sau khi chạy đoạn mã sẽ create 3 bài viết khác nhau về thời gian trên facebook bằng cách dùng lệnh while và endWhile, lệnh date() trong javascript. Trong case bạn phải nhập đoạn text dài hoặc phải tạo nhiều bài viết bạn có thể dùng đoạn script này.

Bài viết trên là những kiến thức căn bản dùng javascript trong selenium IDE . Nếu biết dùng linh hoạt javascript sẽ giúp bạn tạo được ra nhiều hàm mới bằng user-extensions.js .