Selenium Webdriver: Checking all fonts on a page - java

For a Sprint-story, I need to assert that a certain font is not available anymore on different pages. Right now, I can verify that a certain element doesn't contain a font and is indeed replaced by another, but is there a way to check entire pages for the presence of a certain font?
I use Selenium Webdriver cucumber/Java within IntelliJ.

It depends on whether the font is specified through a FONT tag or CSS. FONT tags are obsolete now and discouraged from use but you could use the code below to find them and write the entire tag out to the console.
// find FONT tags
List<WebElement> foundFontTags = driver.findElements(By.cssSelector("font[face*='fontname']"));
for (WebElement foundFontTag : foundFontTags)
{
System.out.println(foundFontTag.getAttribute("outerHTML"));
}
To find it in the CSS is going to be a bit more tricky. Your best bet is to talk to dev or your design team and ask how the font might be specified (if you don't already know). The problem is that without that knowledge, you are going to be looking all over the place for the font. It could be specified inline, a STYLE block, in a separate .css file, and so on each of which is going to require its own search. I provided one example for searching for a font in an inline CSS style.
// find font-face in inline CSS
foundFontTags = driver.findElements(By.cssSelector("[style*='font-family:fontname']"));
for (WebElement foundFontTag : foundFontTags)
{
System.out.println(foundFontTag.getAttribute("outerHTML"));
}
If the font is not specified in an external .css file, you might be able to get away with a text search of the entire HTML source for "font-face:fontname".
One other caveat... just because you find a definition of a css class that contains the wrong font doesn't mean it's actually applied to a visible element. That's a whole other issue. You probably should get a good definition of what success looks like from the Sprint team.

You could use Selenium like so:
WebElement.getCssValue("text-align")
But this will be a bit tricky for all the CSS you'll have to validate. Here is a good article about that . Maybe a CSS unit testing like Quixote libs/frameworks will be a better fit. Other possible way (that I've used succesfuly) - visual regressions with huxley, it can support your entire layout presentation's validation.

Related

Can you use font ligatures with JavaFX

I'm implementing a text editor based on JavaFX. Is it possible to display font ligatures in the same way they work for example in Intellij?
I've found a reference to ligature support in the JavaFX API, but I don't know if this "proves" that there's support.
You can use Tomas Mikula RichTextFX library.
https://github.com/FXMisc/RichTextFX/
You many options here :
1) InlineCssTextArea uses the 
Node#setStyle(String cssStyle)
 method to style Text objects of
InlineCssTextArea
and for each word or line you can set a different style using :
InlineCssTextArea.setStyle(from,to,style);
I have extensively used it before to have different fonts and styles inside the same line or lines.
2) StyleClassedTextArea uses the Node#setStyleClass(String styleClass) method to style Text objects. You can define the style classes in your stylesheet.
So let's say that inside your application.css you have defined 5 different style classes with different fonts. One of them might be...
.red { -fx-fill: red; }
so you can use :
styleClassedTextArea.setStyleClass(from, to, "red");
This renders the text in the range [from, to) in red.
3) For more please check https://github.com/FXMisc/RichTextFX it has detailed description.
Also you can search for more examples on the web.
JavaFX will render required ligatures, but it has no ability to opt in to optional ligatures. The issue tracking adding an API to enable this behaviour is https://bugs.openjdk.org/browse/JDK-8091616.
See also this message from the OpenJFX dev mailing list: https://mail.openjdk.org/pipermail/openjfx-dev/2022-October/036309.html

GWT syntax highlighting in TextBox

I have a TextBox in a GWT app I'm building that's used for advanced searched. I'm trying to find a way to use syntax highlighting for certain characters sequences (e.g. the string #title, or just #T) in the search string, but I can't find anything about how to allow for coloring of individual symbols. I suppose I need something more complex than just a TextBox but I'm not sure what to use. Would it perhaps be possible to do with a single-line, stripped down RichTextBox, or is there a better way?
You cannot do it with an input. Use a FlowPanel (or simply a div element), and set ContentEditable on it. Most browsers support it now. Then you can insert regular HTML tags (bold, span) inside the text on KeyUpEvent, and you can style the spans anyway you like.

webdriver click on a link in a webpage

I'm trying to click on a particular link in a webpage. Basically this is a Home button. So whereever I browse, I always find this button is same position.
As of now I use driver.findElement(By.xpath("//span/ul/li/a")).click(); command to click on this, but this is not working in all the webpages even though the xpath don't change. here is the firebug view of the link.
the id is not static, it keeps on changing. So what are the other ways I can detect this link ?
You can use By.linktext()
driver.findElement(By.linkText("Home")).click();
As dirkk said, you can always locate an element through a By.linkText() selector, although this could be a fickle solution: the "home" link text could eventually change (in which case your selector won't work anymore), there could be other "home" links on the page (in which case you wouldn't necessarily obtain the element you want) or the "home" link text might be different in a different language (in which case your selector will only work when testing the English site).
If you have control over the generated HTML code, you should try adding a static ID or even a class to this link and look it up through a By.id() or By.cssSelector() selector.
If you don't, try using a selector that relies more on semantics (IDs and classes) than structure (tag hierarchies). That way your selector will be more stable and easier to understand as well. But in the end, that's not always possible if you test an untestable external website.

Detect background color of a website

I am trying to detect color of different elements in a webpage(saved on machine). Currently I am trying to write a code in python. The initial approach which I followed is:
find color word in html file in different tags using regular expressions.
try to read the hex value.
But this approach is very stupid. I am new to website design, can you please help me with this.
There can be multiple stylesheets, and many cascading styles. You don't know which elements visually end up being the "background" elements. I think if you're looking for something robust that will work on most webpages, you need to leverage a browsers rendering engine and focus on identifying what a user would see.
Consider using a web browser to render the page, taking a screen shot, and then doing image processing to find the most frequent color near the sides of the page. You can use a scriptable browser like phantomjs.
If you're new to programming, this approach is going to be wayyyyy over your head.
In java you can use JSOUP. Its quite good
Document doc = Jsoup.connect("http://YourPage.html").get();
Elements colors = doc.select("[bgcolor]");
I don't know anything about Java or Python, but could you have it parse the html code and look for something like 'background-color: < color >'?

How to display part of an HTML document in Java

I have an application where I need to show one specific section of a HTML document within a swing JPanel. The section to be shown depends on what the user is doing at any given time.
I know that JEditorPane can display simple HTML, and in fact in terms of HTML support this is more than enough for my needs. However I don't think I can use this to display only part of the original HTML file.
I thought of putting each section within a div, then hiding all divs with CSS (display: none), and showing only the target section by setting display: block on the section I wanted to show. Unfortunately JEditorPane has limited CSS support and this does not seem to include the "display" attribute.
Before I go and implement something more elaborate, is there any simple way to achieve this goal?
Thanks.
You may try Cobra :
http://lobobrowser.org/cobra.jsp
Override the ViewFactory and replace DIV views. If they should be hidden let them return 0 from getXXXSpan methods.
See for example the section folding related code http://java-sl.com/collapse_area.html
I didn't find a way to do what I wanted relying on the CSS support from the JEditorPane. What I ended up doing is manually parsing the HTML document and splitting it in "fragments" (top-level DIVs representing sections), then displaying each section as required via JEditorPane.setText.

Categories

Resources