I am working on a WPF aplication and I want to get the rendered HTML of a website that uses Angular JS technology. Here is what I've tried:
First, I create a WPF Web Browser control:
private WebBrowser webBrowser;
Then I navigate it to my target web page:
var uri = new Uri("http://my-angualrjs-site.com", UriKind.RelativeOrAbsolute);
webBrowser.Navigate(uri);
In the LoadCompleted event handler of my WebBrowser instance I cast the retrieved document to mshtml.HTMLDocument:
var doc = (mshtml.HTMLDocument) webb.Document;
And all I get is the raw HTML of the page, not the HTML processed and rendered by Angular JS from the server. Am I missing something?
I had a similar issue with not being able to get an angular page to render properly in the control.
After following Noseratios answer it was rendering and working good.
Maybe this would help you too:
C# webbrowser Ajax call
In short, you need to add features to the control to make the behavior closer to IE.
With his solution you'll be able to use code such as:
SetBrowserFeatureControlKey("FEATURE_AJAX_CONNECTIONEVENTS", fileName, 1);
Related
I create a jsfiddle page:
jquery datatable with Angularjs - individual column searching
all the angularjs binding not work, it shows
{{n1}}
which should show the actual binding content.
the external resource angularjs, cdn URL seems does not working.
the external resource angularjs cdn url does not work,
you must click javascipt setting, then choose framework & extensions, as angularjs
see screen shot
In my single page application developed using Angular Js, I don't want to navigate in browser using browsers Back button,How to Hide or Disable or override the Back button function
You cannot control browser features using Javascript. It's as simple as that.
I found an answer here. But this code above will not work well with AngularJS because AngularJS uses URL_Hash # in the background.
Control or Disable Browser Back Button with Javascript or AngularJS
I am working to automate UI/acceptance tests for an angular SPA (Single Page Application) using Coded UI.
The client side is completely developed on Angular and Bootstrap. We also use kendo controls like kendo grid. We use the ‘UI-Router’ framework built in Angular for routing.
To automate a sample test case - “Open DataTable app from Home page” using Coded UI, following are the steps:
1) Open IE and go to WebConsole home page
2) Identify DataTable icon.
3) Click on the icon.
4) Validate DataTable app.
I am able to automate steps 1-3, but after clicking on the DataTable icon, the DataTable app is not being displayed. The UI still shows the Home page.
We tried clicking the DataTable icon manually during the test run to see whether the click is working and it did not work.
I tried searching on web about this but could not find anything useful.
Any pointer in this regard will be helpful.
Potential options I use for finicky controls
using mshtml;
var htmlHtmlElement = yourControl.NativeElement as HTMLHtmlElement;
if (htmlHtmlElement != null)
{
htmlHtmlElement.click();
}
Or
control.RunScript("arguments[0].click();");
// Extension class
private static object RunScript(this HtmlControl control, string script)
{
var bw = control.TopParent as BrowserWindow;
return bw.ExecuteScript(script, control);
}
I am working on an application in which we open all the views in a tabPanel, it was pretty simple to do that.
Now we got a new requirement where we have to open the view in Browser popup window so that it can be dragged to a secondary monitor. Ext.Window will not work.
we have a single page application and not sure how i can open a view in separate browser window.
i have tried the following, but then no JS events works on the new window:
var OpenWindow = window.open('', windowName, 'width=330,height=200,resizable=0');
OpenWindow.document.body.appendChild(divObj);//divObj is a div object in which i rendered the extjs view.
it open the popup but non of the style or js is working.
please help or point some example where it is accomplished.
Thanks in advance.
When opening a new window it doesn't have any information about ExtJS at all. you will need to include extjs into the new windows html. The best way to do this is to create a new popoup index file or page to be called. so say you are using routers properly in extjs say you have a site called http://testsite.com
Then you can in your window being opened create the elements in your current application to load when calling testsite.com/#popup then you just place it into your window.open. If you are managing your calls with something like PHP and using a framework for routing you can set it up the same way and have your javascript and extjs to be called from it as well.
var OpenWindow = window.open('http://testsite.com/#popup', windowName, 'width=330,height=200,resizable=0');
Reccomend creating a router like this: Extjs Routing Guide and from there have the component brought into focus on the page and placed that url into your popup if no backend system is used. Creating a new route in a backend link would be the best way to go, but you will still need to call your extjs applications components into your new page as well.
I am using Extjs4.0 to develop a web application. The application require drag a Extjs Panel outside current browser. Then create a new browser instance which has the panel object.
I did some research. Javascript has window.open function which can create a new window. But how can I pass the panel parameters to the new browser instance?
Does any one have relative experiences? or have some suggestions?
Try GreyBox
Note :- Sometime it breaks if there is an error in page
for e.g. it fails to open SO
but it works fine otherway
This is impossible. You are asking if you can drag an ExtJS Panel outside the Browser itself? Think about it, you can't do that.
You can open a new Window with ExtJS content, sure.