JavaFx WebEngine - Overwriting a website's stylesheet with (local) files - java

I'd like to customise the appearance of a website that I am loading, so I created a little test.css file that does nothing but changing the look of all table rows:
tr {
height: 22px;
background-image: url("test.png");
}
How do I get he WebEngine to load this file and replace the page's own CSS rules with mine?
Also, i'd like to be able to load page-specific css files and not one huge file for all pages.
I found this page, but it only shows how to run through the DOM and assign a new style to the desired elements by hand. This is, of course, not what I want. Instead, I'd like the browser to use my files as 'user defaults'.
Thx for any help :)

First of I have to state, that I hope you know what you are doing, as these things can seriously damage a web site.
So here is what you can do:
You grab the Document from the WebEngine, retrieve the head element and add a style child element to it, containing the src location of the stylesheet you want to add.
Document doc = webView.getEngine().getDocument();
URL scriptUrl = getClass().getResource(pathToAttachedDocument); // pathToAttachedDocument = CSS file you want to attach
String content = IOUtils.toString(scriptUrl); // Use Apache IO commons for conveniance
Element appendContent = doc.createElement("style");
appendContent.appendChild(doc.createTextNode(content));
doc.getElementsByTagName("head").item(0).appendChild(appendContent);
By the way, JavaScript can be added in a similar way, it's just 'script' instead of 'style'

I would do like this to ADD or REPLACE any rules :
String css = getFileAsString("style.css");
Document doc = webEngine.getDocument();
Element e = doc.getElementById("my_style");
e.setTextContent(css);
... given a
<style id="my_style"></style>
tag in the HTML document.

setUserStyleSheetLocation()was designed for that very purpose: to let the user of the web page, style it as they want.
Usage:
webEngine.setUserStyleSheetLocation(styleSheetURL.toString());

Related

Java jsoup selecting links

I am trying to develop web scraper, I can extract all the links from a page, but I want to get some specific ones, I checked but I could not manage it as I dont have good knowledge in HTML
You can use the CSS selector presented in the snippet below:
doc.select("div.indepth-content > div.content > ul.indepth-list a")
On the screenshot, it seems you're using Chrome browser. If so, next time you can ask it to generate the CSS query for you:
Right click on the element you target
Click on "Inspect" (a node should appear selected)
Right click on this node then select Copy entry and Copy selector sub-entry
=> The CSS selector is copied in the clipboard
Please note that Chrome tends to generate (very) long CSS queries. Also, it can't generate CSS selectors for matching multiple elements.
However, if you type CTRL + F while the DevTools pane is opened and Elements tab selected, you can type a CSS selector and browse among the matched elements.
For more details, you can have look at the following resources:
JSoup CSS selector tutorial
JSoup CSS selector full syntax
How to generate CSS selectors with Chrome Developer Tools?
Element divcontent = doc.select("div.content").first();
Element ul = divcontent.select("ul.indepth-list").first();
ul.select("a[href]");
Written without editor so i can't remember if the syntax is correct.

Selenium: how to get the value of hidden element which has all div tags

I would like to get the value of all div tags specified in attached. I have tried with all possible locators like classname etc, which is showing null. and tried with JavaScript also which is returning null.
Please see the screen shot and I need the selected text which is in blue color starts with "Enables enterprise IT to deploy networking services"
You need to research creating selectors as this isn't a difficult one. There are numerous approaches for this element, but here's one for you: $$("#offers-popover .description"). Obviously this is a CSS selector based on the $$ and you use getText from the Selenium API in order to scrape the element text, which is what I assume you are intending to do.
driver.findElement(By.css("#offers-popover .description")).getText();
Since your element is not visible you can try this:
String divText = driver.findElement(By.className("description")).getAttribute("textContent");
Or, if this is not the only element on the page with the class description:
WebElement popElement = driver.findElement(By.id("offers-popover"));
String divText = popElement.findElement(By.className("description")).getAttribute("textContent");

How to present a pretty printed Java source located outside the HTML file?

I am looking at writing a tutorial for a Java concept where it would be really nice if I could write the tutorial as a HTML-document with pretty printed Java sources.
I understand I can do this with e.g. http://code.google.com/p/google-code-prettify/ if I copy the various Java sources in my HTML document where I want them to be and put a styling class on the surrounding tag.
However, in order to ensure that the snippets are up to date I would really like to have the HTML page refer to the actual, real Java source files instead of a manually maintained copy.
To my understanding - which may be wrong - this is not supported directly by the Google Prettyprint library, but perhaps some trickery with Javascript pulling in the file and putting it in the DOM tree inside a <pre> tag could do it? I would like the HTML file to be present in the local file system, so doing server side scripting is not an option.
My question is - how can I do this?
(I intend to have the HTML file physically placed at the root of the source tree. This mean that all references from HTML to Java sources will be relative and without '..'. I do not know if that is important or not.)
There is no way to access files directly using JavaScript. JavaScript is restricted in this way for obvious security reasons.
You will need your webserver to serve the Java files. You don't need to do server side scripting but the content of your Java files has to be available at some web address. If they are you can load the content of the Java files with AJAX and inset the content into your webpage.
Using jQuery loading the text could be done as follows
$.get('java/somefile.java', function(data) {
$('#sourceCodeDestination').html(data);
// Prettyprint neeeds to run again in order to see the newly added code
prettyPrint();
}, "text");
This will load the url java/somefile.java get the content of it as plain text and insert it into the DOM element with the id sourceCodeDestination. For more information see the jQuery documentation on get() and ajax().
Here is a demo. As you can see it loads a minified version of the Prettyprint sourcecode from a CDN and pretty prints it.
if your users can accept the requirement of online access while reading your document, you could host your code somewhere like gist (https://gist.github.com/), and embed it in your html dopcument (see example by putting this into your document <script src="https://gist.github.com/sangohan/6494440.js"></script>)
Assuming prettify.js has been loaded previously you can invoke the function prettyPrint which takes arguments callback and rootNode.
<div id="foo">
<pre id="bar"></pre>
</div>
var pre = document.getElementById('bar');
pre.textContent = 'function () {\n return;\n}'; // assign code
pre.className = 'prettyprint'; // assign class
prettyPrint(null, document.getElementById('foo')); // prettify
DEMO

Read href inside anchor tag using Java

I have an HTML snippet like this :
View or apply to job
I want to read href value XXXXXXXXXX using Java.
Point to note: I am reading the HTML file from a URL using inputstreamreader(url.openStream()).
I am getting a complete HTML file, and above snippet is a part of that file.
How can I do this?
Thanks
Karunjay Anand
Use a html parser like Jsoup. The API is easy to learn and for your case,the following code snippet will do
URL url = new URL("http://example.com/");
Document doc = Jsoup.parse(url, 3*1000);
Elements links = doc.select("a[href]"); // a with href
for (Element link : links) {
System.out.println("Href = "+link.attr("abs:href"));
}
Use an HTML parser like TagSoup or something similar.
You can use Java's own HtmlEditorKit for parsing html. This way you wont need to depend on any third party html parser. Here is an example of how to use it.

How can I open an HTML page and show it in a text area?

How can I open an HTML page and show it in a text area? (If I choose the HTML file with the JFileChooser, how can I open that page and show it in the text area?)
URL url = new URL(String s);
JEditorPane pane = JEditorPane(url);
But how can I find the link of the HTML file for inserting as s, here!?
A TextArea is for displaying/editing text, not for showing formatted HTML.
JEditorPane supports HTML markup, but only a rather limited subset.
For full HTML support, you're going to need third-party components. Look at the answers to this question for links.
Format the HTML with a <pre> tag
I guess you can use any properly formatted URL a browser would use e.g.
http://stackoverflow.com/questions/1239454/how-can-i-open-an-html-page-and-show-it-in-a-text-area
But then again Java is very keen on security and you might not be allowed to use certain URLs in your environment.
And like Michael Borgwardt said - the JEditorPane's support of HTML is very limited and some tags (i think <div> is one of them) as well as JavaScript are not supported.
For implementation of a simple browser have a look at this
JEditorPane Tutorial

Categories