Comments (2)
Annoying these JavaScript frameworks.
I don't believe there currently is a 'standard' way to deal with this. A subclass of BrowserTest could probably hide the magic to shift focus, so the test scripts are not polluted with it. Similar tricks were needed for Angular 1 and RichFaces validations.
Having said that I expect fixing the 'click' behaviour might be possible in the generic browser test. I believe the labels are not hidden/opaque until focused so that could be an extra trick to learn browser test (I'm actually surprised it doesn't at the moment), but I haven't really looked into it.
from hsac-fitnesse-fixtures.
I managed to make click and enter work using a custom subclass.
The problems with this element turned out to be twofold:
- when clicking BrowserTest tries to click the label, but Selenium does not want to do that because the input (although transparent) is above it and would therefore get the click (I worked around this by clicking the label using Javascript directly).
- when entering a value the value is not intractable since it is transparent (as you found this can be fixed by focusing the element).
With a setup like this you can isolate the changes to code so the actual test/wiki pages only have to use another fixture, but their steps are the same.
|script |vue3 test |
|seconds before timeout|3 |
|open |https://vuetifyjs.com/en/components/text-fields/#misc |
|ensure |is visible|City |
|click |City |
|type |hello |
|check |value of |City |hello |
|ensure |is visible|State/Province/Region |
|enter |TEST |as |State/Province/Region|
|check |value of |State/Province/Region|TEST |
package nl.hsac.fitnesse.fixture.slim.web;
import org.openqa.selenium.WebDriverException;
import org.openqa.selenium.WebElement;
public class Vue3Test<T extends WebElement> extends BrowserTest<T>{
@Override
protected boolean isInteractable(WebElement element) {
boolean interactable = super.isInteractable(element);
if (element != null && !interactable) {
focusElement(element);
interactable = super.isInteractable(element);
}
return interactable;
}
@Override
protected boolean clickElement(WebElement element) {
return doIfInteractable(element, () -> {
try {
element.click();
} catch (WebDriverException e) {
if (clickExceptionIsAboutHiddenByOtherElement(e) && isVueHiddenElement(element)) {
clickWithJavascript(element);
} else {
throw e;
}
}
});
}
private Object focusElement(WebElement element) {
return getSeleniumHelper().executeJavascript("arguments[0].focus()", element);
}
private boolean isVueHiddenElement(WebElement element) {
return element.getTagName().equalsIgnoreCase("label");
}
private void clickWithJavascript(WebElement element) {
getSeleniumHelper().executeJavascript("arguments[0].click()", element);
}
}
Maybe you can use this as a starting point and see what is needed to make a fixture that is fully functional with Vue, for your suite? I would be happy to add it if you submit a PR with it.
from hsac-fitnesse-fixtures.
Related Issues (20)
- Webdriver issue CHROME 119 HOT 3
- 5.2.45 and up: org.openqa.selenium.WebDriverException: disconnected: not connected to DevTools HOT 2
- Can this constant be defined in the SuiteSetup? HOT 1
- hsac fitnesse fixtures not working after angular upgrade to 14 in headless chrome HOT 1
- hsac/fitnesse-fixtures-test-jre11-chrome:5.3.6 is missing expected files HOT 4
- How to from $drmName get text uncle? HOT 2
- HIGH Vulnerabilities in transitive dependency HOT 7
- Why are the linux drivers explicitily excluded? HOT 1
- Images for version 5.3.8 are missing HOT 1
- Can we access shadow dom elements in our scripts ? HOT 3
- How to reset "pageLoadWait" value? HOT 2
- hsac.fixtures.version > 5.3.10 > This version of ChromeDriver only supports Chrome version 110 HOT 1
- How to use hsacfit to test the branch process? Are there any keywords that can be used? HOT 1
- The valueOf how get <div> text? HOT 2
- BrowserTest value of don't get the div text HOT 2
- How to config chrome extensions?
- "alert text" gives "Unhandled alert: alert must be confirmed or dismissed before test can continue. Alert text: ..etc..." HOT 6
- how to set edge zoom to 100 percent ? HOT 2
- How can I increase javascript script timeout ?
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from hsac-fitnesse-fixtures.