Clicks fail when put between multiple measure.start and measure.stop

[j940927]

When putting actions under one measure.start/stop block, the actions work fine, but if seperate these actions into two measure.start/stop blocks, the actions in second block fails. From Chrome dev tool can see it's returning error in console.

Script that works:

    await commands.measure.start('Enter new Page');
    await commands.click.byXpath('//h6[contains(text(),"$$$")]');
    await commands.wait.byXpath('//h3[contains(text(),"$$$")]',60000);
    await commands.wait.byPageToComplete();
    //await commands.measure.stop();

    //await commands.measure.start('Get quote');
    await commands.click.byXpath('//button[contains(text(),"$$$")]');
    await commands.wait.byPageToComplete();
    return commands.measure.stop();

Script that fails:

    await commands.measure.start('Enter new Page');
    await commands.click.byXpath('//h6[contains(text(),"$$$")]');
    await commands.wait.byXpath('//h3[contains(text(),"$$$")]',60000);
    await commands.wait.byPageToComplete();
    await commands.measure.stop();

    await commands.measure.start('Get quote');
    // below click will fail
    await commands.click.byXpath('//button[contains(text(),"$$$")]');
    await commands.wait.byPageToComplete();
    return commands.measure.stop();

Error in Chrome console:

Versions(Running on Macbook):
Mac OS: darwin 19.0.0 nodejs:12.18.2 sitespeed.io:13.3.2 browsertime:8.14.0 coach:5.0.1 chrome: 86

[j940927]

Note: the click that failed won't direct to another page, but it will send some more requests

[soulgalore]

Hi @j940927 its super hard for me to guess what's going on, can you follow the instructions in https://www.sitespeed.io/documentation/sitespeed.io/bug-report/#explain-how-to-reproduce-your-issue that will make it easier for me so I can reproduce and understand what you try to do.

Thanks!

[j940927]

Hi @soulgalore, thanks for your quick response!
Below is the whole script I use, I execute it with command sitespeed.io test.js --multi -n 1

test.js

module.exports = async function(context, commands) {
  
  try {
    //Deleted URL
    await commands.measure.start('','Load home page');

    await commands.measure.start('Enter Secure First Page');
	
    // Open Accident & Other Protections menu and click Secure First link
    await commands.click.byXpath('//a[contains(text(),"Accident & Other Protections")]');
    await commands.click.byXpath('//h6[contains(text(),"Secure First")]');
	
    // Wait for Secure First page header to display
    await commands.wait.byXpath('//h3[contains(text(),"Secure first")]',60000);
    await commands.wait.byPageToComplete();
    await commands.measure.stop();
	

    await commands.measure.start('Get quote for Secure First ');
    // Enter birthday/gender/sum assured details and click get a quote
    await commands.js.run('document.querySelector("input#quote-birthday").value="14-Apr-1996";');
    await commands.click.bySelector('div.section-container section div.btn-female label');
    await commands.addText.bySelector('600000','input[name="sumInsured"]');
    await commands.click.byXpath('//button[contains(text(),"Get a quote")]');
    
    // Wait for quote to display
    await commands.wait.byXpath('//div[contains(@class,"offerPrice")]/span[contains(text(),"150")]',60000);
    await commands.wait.byPageToComplete();
    return commands.measure.stop();


  } catch (e) {
    
    throw e;
  }
};

If script contain first measure.stop(), clicking "Get a Quote" will hit error as screenshot I shared in original post, if I delete first measure.stop(), then the script works fine. Can you please help try if you can reproduce this issue on your side?

[j940927]

Hi @soulgalore , I've found the root cause of this issue.

It is due to below code in sitespeed.io\node_modules\coach-core\dist\coach.min.js
for (var t = window.jQuery; t.fn && t.fn.jquery && (t = window.jQuery.noConflict(!0), window.jQuery && window.jQuery.fn) && t.fn.jquery !== window.jQuery.fn.jquery;) e.push(window.jQuery.fn.jquery)

After window.jQuery.noConflict(!0) is executed, $ is no longer referring to jQuery, so when the website used $ to call jQuery, error "$ is not defined" occured.

I've fixed this issue by giving back jQuery to alias "$" after jQuery.noConflict is executed.
var tempForTest = window.$; for(var t=window.jQuery;t.fn&&t.fn.jquery&&(t = window.jQuery.noConflict(!0),window.jQuery&&window.jQuery.fn)&&t.fn.jquery!==window.jQuery.fn.jquery;) e.push(window.jQuery.fn.jquery)} window.$ = tempForTest;

Please advise if this modification would break anything else, thanks!

[soulgalore]

Thanks @j940927 for looking into this. I'm moving this to the coach and will implement your fix there.

[j940927]

Thanks! I tried to create a pull request in Coach but didn't succeed.