Replace HTML in response using Fiddler - fiddler

I want to do something as simple as changing a color code in the response of an HTTP request, but I can't seem to figure it out. Basically, when a certain website loads, The background is set with the color code "#db4437" and I'd like to have it always be changed to "#09C3FF" when the website loads.
I found this code for Fiddlerscript in the Fiddler guides, but it doesn't seem to really do anything at all
if (oSession.HostnameIs("www.bayden.com") &&
oSession.oResponse.headers.ExistsAndContains("Content-Type","text/html")){
oSession.utilDecodeResponse();
oSession.utilReplaceInResponse('<b>','<u>');
}

This example from Telerik documentation works for me:
Remove all DIV tags (and content inside the DIV tag)
// If content-type is HTML, then remove all DIV tags
if (oSession.oResponse.headers.ExistsAndContains("Content-Type", "html")){
// Remove any compression or chunking
oSession.utilDecodeResponse();
var oBody = System.Text.Encoding.UTF8.GetString(oSession.responseBodyBytes);
// Replace all instances of the DIV tag with an empty string
var oRegEx = /<div[^>]*>(.*?)<\/div>/gi;
oBody = oBody.replace(oRegEx, "");
// Set the response body to the div-less string
oSession.utilSetResponseBody(oBody);
}

Related

read a websites html code, then select an element and then make an action on that element

I want to know how Read a websites html code. Then i want to take a specific Element from the html code and make a request to make an action to the Element(e.g. Button,Textfield)
For example i take a websites URL, read the html code,take the element a button and then press the button from my Flutter App.
Web Crawlers/Scrapers only works on mobile clients (or website with CORS enable).
You need to add the following libraries http and html inside your pubspec.yaml:
html: ^0.14.0+3
http: ^0.12.0+4
// latest versions by Feb 18th 2020
to use it, create an async method to fetch the URL you want to "read":
Future<Response> _initiate(String url) async {
Response response = await get(url);
return response;
}
and then, use it this way, reading the specific div, a, img, etc you need:
_initiate(url).then((response) {
var document = parse(response.body);
var items = document.querySelector('div.groupHomeHeader-banner');
var split = items.attributes.values.toList()[1].split('(')[1];
var image = split.substring(0, split.indexOf(')'));
var name = document.querySelector('a.groupHomeHeader-groupNameLink');
});
Every Element has different attributes. For example, an InputElement has the attribute 'click()' and creates the desire effect.
Example of this will be:
var openDoc = document.querySelector('div.pdfInput') as InputElement;
openDoc.click();

ng-click not working in HTML loaded into div

I've seen a couple answers but can't seem to figure out how to apply them.
I have a page that's two divs. A side nav div and a main div. On the page load, the js below loads up the html into the main div. The same function is used to jump around (via the nav) within the doc once loaded.
The problem is, there are also links within the HTML to the function since there are some self-referencing points, etc.
The side nav ones work fine, the ones within the HTML don't. I'm assuming it's a compiling issue of sorts, but I can't quite figure out how to compile it correctly.
Here's the JS:
Ctrler.loadPage = function(hash){
if(!hash){
var url = "filename.html";
var xhr= new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.onreadystatechange= function() {
if (this.readyState!==4) return;
if (this.status!==200) return;
cur = this.responseText;
cur = cur.replace(/{{sitePath}}/g, jsPath.path);
document.getElementById('maindiv').innerHTML= cur;
$('#maindiv').html = this.responseText;
};
xhr.send();
}
else{
document.getElementById(hash).scrollIntoView();
window.scrollBy(0, -90);
}
}
EDIT: I changed the lines that populate the div to this:
$compile(cur)($scope);
$('#maindiv').append(cur);
but it still doesn't work. It loads the first time, but ng-clicks still don't work.
I figured it out.
I needed to compile $('#maindiv') after I added cur. Not cur

Using dojo dom.byId is not getting an element added programmatically

I'm creating a dom element programatically using dojo and I can "see" it in the dom with its id, but when I attempt a dom.byId("myId") it returns null.
I have a similar jsfiddle that is actually working (so it doesn't reproduce my problem, but it gives an idea of what I'm trying to do): if you click the button (ignore the lack of styling) in the run output panel, it alerts the content of the element retrieved by dom.byId. But similar code within my dojo widget is not working. Here's the code:
var content = lang.replace(selectFilterTemplate, {
"layer-id": layer.id,
"layer-index": idx,
"filter-name": filter.name
}); // this gets template HTML code similar to what's in the HTML panel of the jsfiddle, only it has placeholder tags {} instead of literals, and the tags are replaced with the attributes of the layer, idx, and filter objects here
// Use dojo dom-construct to create a div with the HTML from above
var node = domConstruct.create("div", { "innerHTML": content });
// put the new div into a dojo ContentPane
var filterPanel = new ContentPane({
"id": layer.id + "-filter-" + idx + "-panel",
"content": node,
"style": "width: 200px; float: left;"
});
// Get the dom element:
var mstag = dom.byId(layer.id + "-filter-" + idx + "-ms-tag")
// this is the same as the "var ms = dom.byId("IssuePoints-filter-1-ms-tag")" in the jsfiddle, but this one returns null. If I view the contents of the 'node' variable in the browser debugging console at this point, I can see the <select> tag with the id I'm referencing.
Why would I be getting null in my dom.byId() if I can see that element in the dom in the debugging console?
It seems that the element is added to the dom at a later point. You may see it with the debugger but it is not yet available the moment you call byId().
In the code you posted you create the filterPanel element but you do not place it in the dom. I assume this happens at a later stage. In contrast, the jsfiddle places the Button element with placeAt() directly after constructing it.

How to render a template from controller within template -- Java, Play 2.1

Is it possible to call a controller method to render a template within a template?
Or is that totally the wrong aproach?
In the div container there is only a sting displayed but not the redered html from my productTable template.
The displayed string inside the <div class="products">:
SimpleResult(200, Map(Content-Type -> text/html; charset=utf-8))
Template:
#categories.map {cat =>
<div>some html</div>
<div class="products">#controller.Products.getByCatergoyId(cat.id)</div>
}
Controller:
public static Result getByCatergoyId(Long catId) {
List<Product> products = Product.find.where().eq("category.id", catId).findList();
return ok(views.html.display.productTable.render(products));
}
If you want to get the code from the productTable view your method shouldn't return a Result but just a String containing rendered code.... aaaannnyyyyway , there is definitely much better way for rendering sub-templates in Play, check the Tags section of the documentation it does exactly what you want directly from the view, of course you will need to pass a product object to it.
Just create tags package in your view package and add there your sub-template (responsible for rendering only pat of page) it behaves exactly the same as common template.

Inject css stylesheet in GWT RichTextArea head

is it possible to inject a stylesheet into the head of a GWT RichTextArea
Seems as if i place a style element in the body, some browser e.g. IE7 allows the user to delete the node.
I had the same problem, here's the solution to add in the class constructor:
richTextArea.addInitializeHandler(new InitializeHandler() {
public void onInitialize(InitializeEvent ie) {
document = IFrameElement.as(richTextArea.getElement()).getContentDocument();
StyleElement se = document.createStyleElement();
se.setType("text/css");
se.setInnerHTML("some CSS");
BodyElement body = document.getBody();
body.getParentNode().getChild(0).appendChild(se);
}
});
StlyeInjector can directly insert CSS if you don't want to use a CSS file. It gets put into the head as far as I can tell, but for the whole document.
Yes it is. But you need a library like gwtquery to manipulate the dom, or code some jsni.
I'd rather gquery because of its simplicity and it will work with all browsers.
import static com.google.gwt.query.client.GQuery.*;
// First attach the widget to the DOM
RootPanel.get().add(richTextArea);
// We only can manipulate the head, once the iframe document has been created,
// and this happens after it has been attached.
// Because richtTextArea uses a timeout to initialize we need a delay.
$(richTextArea).delay(1,
lazy()
.contents()
.find("head")
.append("<style> body{background: red} </style>")
.done());
With GWT + JSNI you have to do something like this (not tested in all browsers though):
// First attach the widget to the DOM
RootPanel.get().add(richTextArea);
// We only can manipulate the head, once the iframe document has been created,
// and this happens after it has been attached.
// Using a timer because richtTextArea uses a timeout to initialize.
Timer insertCss = new Timer() {
private native Element getHeadElement(Element iframe) /*-{
return iframe.contentWindow.document.head;
}-*/;
public void run() {
Element head = getHeadElement(richTextArea.getElement());
Element style = DOM.createElement("style");
style.setInnerText("body{background: yellow}");
head.appendChild(style);
}
};
// Schedule the timer
insertCss.schedule(1);