TestCafe takeElementScreenshot behaviour changed - how do I get the old behaviour - testing

I upgraded from Testcafe 1.6.0 to 2.0.1.
I noticed there are differences in how TestCafe takes screenshots.
This is a screenshot from 1.6.0:
This is a screenshot taken with 2.0.1:
This is how it actually looks:
As you can see in 1.6.0 and in the original the "Q" looks more like an "O" because it is cropped - like other letters. overflow: hidden is set on the element.
It makes sense. This is the actual box of the screenshottet element:
The actual text is in a div element inside the screenshottet element:
It seems like in 2.0.1 it disables overflow: hidden on the screenshottet element to take the screenshot.
Is there a way to re-enable the old behaviour?

TestCafe published a new version - 2.1.0-rc.1 with a fix for the issue with screenshosts. Please update testcafe and check the issue again. If it doesn't help, create a simple sample with the following template: https://github.com/DevExpress/testcafe/issues/new?assignees=&labels=TYPE%3A+bug&template=bug_report.yaml

Related

Karate Robot: Not able to click button using image

I am using Karate robot for clicking a button using image.
Below is my code:
robot { app: '^Chrome', highlight: true }
robot.input('OracleDriver')
delay(2000)
robot.click('delete.png')
Sometimes I am able to click delete button for delete.png but other times I am not.
So facing this issue intermittently.
Yes, finding by image is indeed not very reliable and should be only used as a backup when normal windows locators don't work.
I have only the following suggestions:
find a windows locator that works. note that you can navigate from a known locator using someElement.parent.firstChild etc: https://github.com/intuit/karate/tree/master/karate-robot#element-api
try to standardize the resolution that works best
see if using OCR works better
contribute code to Karate to make this better
look for another solution
I tried clicking delete button by using it's class and it is very reliable, below is my code
waitFor('.icons8-delete-blue').click()
I also followed #Peter's suggestion (someElement.parent.firstChild) and it worked for me!, below is the code
waitFor('.modal-footer').children[0].click()
Thanks #Peter for the suggestion

How to make scrollIntoView method work in Laravel dusk

Description:
The scrollIntoview dusk method is not working as expected.
Can anyone please point me the right version of laravel/dusk, chrome driver version to be used to make it work again.
Currently I am using theses versions while running the script.
Laravel framework version: 6.2
laravel/dusk: 6.11
php:7.2
Chrome driver: 88.0.4324.96.
Thank you in advance.
There is a wide range of unexpected behaviours in scrollIntoView(), and related reasons...
Among the many: my own experience was about the Bootstrap navbar placed above the scrolled element, resulting in many "Other element would receive the click" errors. I fixed it with my own Browser Macro, scrolling the element at the bottom of the page (instead of top):
\Laravel\Dusk\Browser::macro('scrollView', function ($selector) {
$selector = addslashes($this->resolver->format($selector));
$this->driver->executeScript("document.querySelector(\"$selector\").scrollIntoView({block: 'end'});");
$this->pause(500);
return $this;
});

Why is PhantomCSS moving the HTML elements around?

Problem: when I use a visual regression testing tool such as PhantomCSS, the screenshots produced contain the website with dramatically moved HTML elements.
Problem image:
How it should really look like: (taken from esfiddle.net )
Tools: PhantomCSS. The same problem happens with BackstopJS.
What can I do to prevent the problem image?
The flex CSS property is causing the problems.
Since version 3 backstop supports chrome as engine, so you could specify
"engine": "chrome"
I think it would work fine in Chrome.

scroll until the element is in view using Selenium2Library Keyword

I am using Robot Framework for my web application automation execution.I had found one such solution using Selenium Web-driver.
scroll until the element is in view using Selenium Webdriver
But I wanted to accomplish this using Robotframewrok-Selenium2Library.
Please suggest such keyword if any.
Thanks.
Finally I got the solution to my query. I have to download the ExtendedSelenium2Library from : Github_Page
then I installed it and it is working fine now.
Thanks.
ExtendedSelenium2Library solved the problem of scrolling down and selecting an element. I used the keyword 'Scroll Element Into View' for my application. However the ExtendedSelenium2Library will not work with the higher versions of the selenium2library.
Below is my 'pip freeze' command output which is working
robotframework==3.0.2
robotframework-extendedselenium2library==0.9.1
robotframework-selenium2library==1.8.0
robotframework-seleniumlibrary==2.9.2
selenium==3.8.0
urllib3==1.22
I was stuck at similar blockade and i could resolve as below:
Hope this might be of little help!
Use ExtendedSelenium2Library Library...
Example:
***Settings***
Library ExtendedSelenium2Library
*** Keywords ****
Add Your Methods
#Execute Javascript window.scrollTo(0,200);
Scroll Element Into View ${YourElement}
Wait Until Element is visible ${YourElement} timeout=5s
Set Focus To Element ${YourElement}
Click Element ${YourElement}

X Displayed in dijit.form.Select

I am working on an application build on Dojo 1.4 and currently used on IE8.
When tried to run IE10 Compatibility view, I observer some X (to clear the data) are being show in the fields like dijit.form.Select. While in IE8 it doesn't display them
Please guide to remove them or what basically is happening
Thanks in Advance
If this is the same problem I just fixed then the question isn't referring to the IE10 "clear field" X. It's referring to a very large text "X" character that is displayed in the Select widget in addition to the options that are supposed to be there, making the widget twice as tall as it should be.
In my case it was because I was mixing the CSS stylesheet from one Dojo version with the API's from another. Check to make sure that your stylesheet and dojo.js versions match. For example, in my case the stylesheet was:
...href="//ajax.googleapis.com/ajax/libs/dojo/1.7.5/dijit/themes/claro/claro.css" media="screen">
while the script being included was
... src="//ajax.googleapis.com/ajax/libs/dojo/1.10.1/dojo/dojo.js"></script>
I blame the fact that I was modifying Dijit sample code without knowing what the heck I was doing...