Is it possible to disable SlowMo when Typing? - playwright

SlowMo allows to have an artificial delay while executing the tests so that we can see what's going on, but if I increase it to 1500ms, then it takes ages to type something, because each character will be typed after 1500ms.
I wish I could enable the SlowMo only for clicks.
For example:
this.Browser = await this.PlaywrightContext.Chromium.LaunchAsync(new BrowserTypeLaunchOptions
{
Headless = false,
SlowMo = 1500,
});
Any idea that might help?
Thanks,

How about delay option on type() call?
https://playwright.dev/docs/api/class-elementhandle#element-handle-type

Related

How to free up memory from Puppeteer in infinite scroll?

I browse an infinite scroll page using Puppeteer but this page is really really long. The problem is that the memory used by Puppeteer grows way too much and after a while, it crashes. I was wondering if there is a nice way to somehow free up memory during the scroll.
For example, would it be possible to pause every minute to remove the HTML that has been loaded so far and copy it to the hard disk? That way, after I'm done scrolling, I have all the HTML in a file and can easily work with it. Is it possible to do that? If yes, how? If no, what would be a viable solution?
I would wager that the approach you outline would work. The trick will be to remove nodes from only the list that is being added to. The implementation would maybe look something like this:
await page.addScriptTag({ url: "https://code.jquery.com/jquery-3.2.1.min.js" });
const scrapedData = [];
while (true) {
const newData = await page.evaluate(async () => {
const listElm = $(".some-list");
const tempData = listElm.toArray().map(elm => {
//Get data...
});
listElm
.children()
.slice(20)
.remove();
//TODO: Scroll and wait for new content...
return tempData;
});
scrapedData.push(...newData)
if(someCondition){
break;
}
}

how to trigger angular parsers without inputing anything in the field

As the subject states, how do I trigger the actions to take place inside a
modelController.$parsers(...)
without user input... the only way I can think of is wrapping them inside a function and call it, but is there a better way to trigger
**//pseudo
$(modelController).trigger('just got dirty');**
the reason I would need this is to trigger the input field to validate itself on submitting page.
I have found a way to solve this - just call the parsers with the model value:
angular.forEach(ngModel.$parsers, function (parser) {
parser(ngModel.$viewValue);
});
It`s so simple, and it seems to be the most correct solution.
This question is actual for me also... Because i am resolving this issue with:
var triggerParsers = function() {
var val = ngModel.$viewValue;
ngModel.$setViewValue(null);
ngModel.$setViewValue(val);
};

cancelling 1 interval on pageChange

I have 2 pages that require a function to be called every minute so I did this using setInterval(). However whenever I navigate to the page a new interval is created and it eventually bogs down the site. Is there a way to cancel an interval whenever I navigate away from a page?
var pollinginterval = 60000;
$('#HomeViewPage_MyLocation').live('pagebeforeshow', function(toPage, fromPage){
GetUsersByLocation();
setInterval(function() {
GetUsersByLocation();
}, pollinginterval);
});
$('#HomeViewPage_ColleagueLocation').live('pageshow', function(toPage, fromPage){
GetAllUsersByTeam();
GetAvailableTeams();
setInterval(function() {
GetAllUsersByTeam();
GetAvailableTeams();
}, pollinginterval);
});
Do you mean when refreshing the browser page? Then you can stop it by listenting for unload:
var runMyFunction = function() {
// clear interval
};
window.onunload = runMyFunction();
If not, you can still clear the interval on your internal page change.
This is because jQM has a problem with multiple events. Ok it is not a problem, you must understand, in your case, each time you access your page same event is applied again.
You can do 2 things to solve this problem:
Instead of live use bind/unbind and on/off to unbind event before binding it again to same element after each pagebeforeshow/pageshow. This is not that good approach.
Example for click event:
$('#elementID').unbind();
$('#elementID').bind('click', function(e) {
});
Correct one would be to use Event filter to check if event is already bound. It can be found here: http://www.codenothing.com/archives/2009/event-filter/
Example for click event:
$('#elementID:Event(click)').each(function(){
});

Ajax queue Backbone js

I am running Backbone js 0.9.2 on Rails 3.2.2,I have a page for adding cost rows.A cost have 3 TextFields: title, description and price.
I am saving each cost on blur.
model.save() gets called multiple times with very short intervals. Which issues one create(post) request then one update(put) request shortly there after. The problem I am experiencing is that PUT request sometimes reaches the server before the POST, the result being that model gets created and persisted twice(duplicates).
To save on blur is the requested behavior, so I need a way to queue up requests.
I have read something about Spine js, and that they solve it by some kind of queue. I've also looked in to this, but can't seem to figure this out.
It feels like this should be a common issue, working with "single-page-apps" but can't find anything about it.
You could override the save method and create a queue with a deferred object . For example,
var MDef = Backbone.Model.extend({
url: "/echo/json/?delay=3",
initialize: function() {
this.queue = $.Deferred();
this.queue.resolve();
},
save: function(attrs,options) {
var m = this;
console.log("set "+JSON.stringify(attrs));
// this.queue = this.queue.pipe with jquery<1.8
this.queue = this.queue.then(function() {
console.log("request "+JSON.stringify(attrs));
return Backbone.Model.prototype.save.call(m, attrs, options);
});
}
});
var m = new MDef();
m.save({title: "a title"});
m.save({description: "a description"});
m.save({price: "a price"});
And a Fiddle : http://jsfiddle.net/nikoshr/8nEUm/
User debounce from underscore.js.
Creates and returns a new debounced version of the passed function that will postpone its execution until after wait milliseconds have elapsed since the last time it was invoked.
This way it will only fire once after the last blur event.

"Too Much Recursion" Problem

I'm helping a company develop a website that utilizes jquery but I have noticed that the site slows to a complete halt with a jquery "Too Much Recursion" error. The company really needs to get this resolved but retain the slideshow capabilities as they are right now. Here is the code in question:
<script type="text/javascript">
var $testimonialCont;
var $slideshowContainer;
$(document).ready(function(){
$slideshowContainer = $('.slideshowContainer');
var inititalSlideshowDelay = setTimeout(cycle_slideshow_image, 4000);
$testimonialCont = $('.testimonialContainer');
$('.testimonialBubble').hide();
$('.testimonialBubble').removeClass('hide');
cycle_top_bubble()
var initialTestimonialDelay = setTimeout(cycle_top_bubble, 3000);
});
function cycle_slideshow_image(){
//This code cycles the slideshow caption headings and body text
$('h1.slideshowCaptionHeading:last').fadeOut(1500, function(){
$(this).prependTo('.captionHeaderArea');
$(this).show(1);
var delay = setTimeout(cycle_slideshow_image, 4000);
});
$('p.slideshowCaptionBody:last').fadeOut(1500, function(){
$(this).prependTo('.captionBodyArea');
$(this).show(1);
var delay = setTimeout(cycle_slideshow_image, 4000);
});
$('img.slideshowSlide:last').fadeOut(1500, function(){
$(this).prependTo($slideshowContainer);
$(this).show(1);
var delay = setTimeout(cycle_slideshow_image, 4000);
});
}
function cycle_top_bubble(){
$('.testimonialBubble:last').prependTo($testimonialCont).fadeIn(1500, function(){
var $this = $(this);
var thisTimer = setTimeout(function(){
$this.fadeOut(1500, function(){
var thisDelay = setTimeout(cycle_top_bubble, 3000);
})
}, 5000);
});
}
</script>
Here is the site's address: http://dbunderdevelopment.com/CRR/
If anyone has any suggestions, I would greatly appreciate it.
P.S. I did post this question before as an unregistered user and I sincerely apologize in advance for that. I can't seem to find the post in order to delete but, rest assured, it will not happen again. I know how bad repostings are on forums.
To me it looks like cycle_slideshow_image calls itself three times each time it is called... change it to this:
function cycle_slideshow_image(){
//This code cycles the slideshow caption headings and body text
$('h1.slideshowCaptionHeading:last').fadeOut(1500, function(){
$(this).prependTo('.captionHeaderArea');
$(this).show(1);
});
$('p.slideshowCaptionBody:last').fadeOut(1500, function(){
$(this).prependTo('.captionBodyArea');
$(this).show(1);
});
$('img.slideshowSlide:last').fadeOut(1500, function(){
$(this).prependTo($slideshowContainer);
$(this).show(1);
var delay = setTimeout(cycle_slideshow_image, 4000);
});
}
Also, cycle_top_bubble is being called twice initially, so it's running in two loops. remove this line:
var initialTestimonialDelay = setTimeout(cycle_top_bubble, 3000);
Another thing to consider is that when your page becomes an inactive tab in the browser, the timeouts are clamped to 1000ms (ref) so the animation may build up if you have the timeouts too short, which you don't, but it's something to keep in mind.
So you need to think about how recursion works, when you recurse in those set timeout functions you create a new scope inside the recursed function, Adding everything onto the stack without popping off the last function.
If you look at this as it is a block of memory but you never recurse which is the returning back up you continue to flood memory with more and more objects until its full. How you can solve this is pretty easy.
First recursion is the wrong approach for something that never completes, I explained why above. The recursion needs to be changed. The solution I would use is have a callback on the setTimeout but move your setTimeouts outside the scope of the calling function. This should help with the memory problem.
Other suggestions is to use a real slideshow plugin that someone else wrote... I know this may be frowned upon but why recreate the wheel when it has been done 1000 times. I recommend jQuery Cycle it is extremely fast and customizable.
Good luck!

Resources