Cannot hide changing element using JQuery

[DHarls17]

Complete JQuery newbie here, so apologies if I'm missing something blatantly obvious! :) 

As part of my nightwatchjs test script, I'm using JQuery to try and stop a Cookie Policy window from displaying.

The Cookie Policy window ID is displayed as either;

div[id=sp_message_container_156527]

or

div[id=sp_message_container_156525]

which of these is displayed is completely random, supplied by a 3rd party.

So I thought I'd use JQuery to try and 'hide' this element from appearing when the page is loaded (which makes my further commands in my script infinitely easier to run) using the following in my nightwatchjs test script;

const { JSDOM } = require( 'jsdom' );
const { window } = new JSDOM( '' );
const $ = require( 'jquery' )( window );

module.exports = { 'XL page gam ads': function (browser) {
   browser.url(browser.launch_url + 'best-cars/young-drivers/');
   $('div[id*=sp_message_container]').hide();
},

However, this does not appear to work, as the element is still being displayed.

Am I doing something obviously wrong here?

Thanks.

[Dustin Ogan]

I think you want to nest this within 

.execute() to alter the page context 

execute has access to the pages JavaScript console 

--
You received this message because you are subscribed to the Google Groups "NightwatchJs" group.
To unsubscribe from this group and stop receiving emails from it, send an email to nightwatchjs...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/nightwatchjs/3fa130ea-4d14-4e20-86c1-5dbc9e493e56o%40googlegroups.com.

[DHarls17]

Many thanks Dustin.

Ok, I have got this working as such by using the .execute command within my nightwatchjs test script.

So my code now looks like;

const { JSDOM } = require( 'jsdom' ); 
const { window } = new JSDOM( '' ); 
const $ = require( 'jquery' )( window );

 
exports.command = function() { 
this.waitForElementPresent('div[id*=sp_message_container]', 60000); 
this.execute(function() { 
$('iframe#sp_message_iframe_156527').remove(); 
$('iframe#sp_message_iframe_156525').remove(); 
return true; 
}); 
};

However, when the iframe is (correctly) removed, there is subsequently no javascript displayed on the resulting page (i.e. when the iframe/s is gone, there are no javascript ads displayed).

Therefore, there are no ads displayed, which I need to test.

Is this expected behaviour?

Thanks

[Chris Jackson]

What happens when you don't use Nightwatch and execute those "remove" functions via the Dev console?  

[davidlinse]

would be handling the 'cookie policy dialog' with nightwatch an option ?

why try to hide when you can 'click it away' ..

regards

~david