Add items to browser context menu? - browser

I have a page in which an augmented context menu would be natural and intuitive for a visitor. Not so different from a ton of pages, I'm sure. EDIT: Of course, I must do that without losing any of the browser's native context-menu items/actions. Just want to add an item.
Is there any way to accomplish that yet in any browser?
We can imagine (putative) markup for such a thing. Maybe somehting like:
<context n onclick="handleNewItem"> my new item </context>
where n is the line number of "my new item"
Thanks!

You could totally replace the context menu with your own, but then you'd loose the standard browser's one.
Unless you are writing a browser extension, I don't know of any way to just append commands to the browser's context menu from within javascript.

Related

chrome extension, how to show a modal from context Menu option?

On clicking the option on context menu (of my chrome extension) I want to show a modal on the page, which contains a form.
How do you implement this?
What I have found implemented right now:
I can easily describe a form in contentScript.js and inject it.
Problems I have found:
Defining the elements to be injected in javascript is tedious. (isn't there a better way)
Website's CSS interferes with my injected elements
Possible solutions I have found:
Shadow-DOM so that website's CSS does not interfere with the injected element.
Example:
Pocket Chrome extension is exactly the type of action I want to build and it doesn't user shadow-DOM. How does it do?

Use a content script to create an element on the page that is invisible to the page

I have a content script in a Chrome extension. I'd like to inject an element into the page, but I need to do so in such a way that the page is unaware of the injected element at all, i.e. it needs to be completely invisible to the page and only visible within the content script context. The page should not be able to locate the element (even with getElementByID), receive events related to it, or anything.
Is such a thing possible? How would I go about doing that? If it's not, what is the closest thing I can do?
If Shadow DOM as mentioned by #Xan doesn't work for you:
The next best thing would depend a lot on what you are trying to do.
A browser action might suit your needs as you could put the data/buttons/etc. you want to display there and the page would not be able to get to it. You could still run a content script to get the data needed from the page.

Trouble attaching to a javascript window with Watir

I am new to Watir, and am working on developing a testing tool for my work.
I have run into a problem that I cannot seem to solve, even after checking several sites.
The javascript window creation is below: (the window created holds a pdf in a window, so the only "buttons" are the minimize, maximize, close)
<a id="LogIn_HyperLink2" class="ms-WPTitle" onclick="javascript:var win = new Window({className: 'spread', title: 'Security Statement', top:0, left:1, width:750, height:365, url:'--redacted--/security.pdf', showEffectOptions: {duration:1.0}}); win.setConstraint(true, {left:10, right:20}); win.showCenter(); return false;" href="--redacted--/security.pdf" style="color:#6699cc; font-weight:bold;">Security Statement</a><br>
I have tried using both
puts browser.modal_dialog(:title, "Security Statement").exists?
puts browser.javascript_dialog.exists?
both have returned 'false'
What approach should I be taking to attach to this new window, or more directly: How can I close this new window?
You can see the page at this link (IE only)
If the window holds a PDF file it's a browser window, not a modal javascript popup (alert, confirm, prompt)
It's defined to start without all the normal menus etc active, but it's still a browser window. You can attach to it as described in the Watir Wiki section about new browser windows, using the url or the title since you know both of those (given the HTML you showed us).
If you are using Watir-Webdriver use it's window switching commands. Right now the watirspec for that is your best reference to the methods supported and how they work.
EDIT
Thanks for the link. While the above would be true for a new browser window, that's not what you are faced with. What you have there is all inside the browser HTML, created in the DOM on the fly with javascript. It's all standard HTML elements, easily interacted with once you know what's going on (this is actually IMHO easier to deal with than a popup or separate window)
Use the IE developer tools, after you click the link that makes that 'window' appear, click the icon in the toolbar of the dev tools to refresh the DOM in the dev tools and you will be able to see that.
The outermost container appears to be a div of class 'dialog', which is unique in the DOM at that point.
The window controls are three divs under that one, with classes 'spread_close', 'spread_minimize', 'spread_maximize'. There are three tables that hold the graphic elements for the top, sides, and bottom of the 'window' but there is ZERO actual content there, it's just a visual windowframe.
There is also an iframe that superimposes that window, which is I think were the content would be (I can't get it to load, maybe because I'm not authorized for it or something)
If you just want to close the window, try this:
browser.div(:class => 'spread_close').click
Since this is coming into existing due to a bunch of client side JS code you may need to use something like the 'when_present' method after clicking the link before you first start to interact with it. eg if all you want to do is click the link to open it, and then close it, you'd do something like this
browser.link(:text => 'Security Statement').click
browser.div(:class => 'spread_close').when_present.click

How to click a strange link looks like button in watir

I want to use the Watir to click a link that looks like a button attached the image.
I use the following method,but doesn't works:
#browser.div(:id,"NetworkAnalysisTabPanel").div(:index,1).div(:index,1).ul(:index,1).li(:index,1).link(:index,2).click
Note:
#browser.div(:id,"NetworkAnalysisTabPanel").div(:index,1).div(:index,1).ul(:index,1).li(:index,1).link(:index,2).flash
is working fine but click is not working in IE and FF
Link looks like this:
And HMTL like this:
Note: I am able to click on the element using selenium IDE with clickAt method
Try this (not tested):
browser.link(:class => "x-tab-strip-menu").click
If you can flash the link, but click does not do what you want, see this: How to find out which JavaScript events fired?
FYI what you have are links that are using standard background images controlled via CSS magic that keys on the class of the link to know what background to set. That's where the image comes from, and why you don't see it as part of the link in the HTML.
In that control, each tab is a list item element (li) in an unordered list (ul), and each list item has an ID, so that's the easiest way to tell it which tab you are trying to click inside.
Try identifying things starting with the LI that is the tab container, as within that container there is only one instance of each link of a given class. Of the 4 links, only one is without any kind of easy identifier, and if you need to click that one you'd need to use :index, but for the other 3 links using :class ought to work. This should result in code that is less brittle and subject to being broken if the order of tabs changes, or the page is refactored.
#browser.li(:id,"NetworkAnalysisTabPanel__ext-comp-1038").link(:class, "x-tab-strip-menu").click
If the number at the end of the ID is subject to change, you can try a regular expression to match the part you can predict and is unique from the others
#browser.li(:id,/NetworkAnalysisTabPanel__ext-comp-/).link(:class, "x-tab-strip-menu").click
If you can reliably identify the object and use .flash but .click does not seem to do anything, you may have to use .fire_event('onclick') instead or .click.
#browser.li(:id,/NetworkAnalysisTabPanel__ext-comp-/).link(:class, "x-tab-strip-menu").fire_event('onclick')
If that does not work, then you need to start experimenting with likely events that the control might be looking for (which will not necessarily show up in the HTML btw.. it may be in javascript or CSS etc)
UPDATE
This is where having an live example of the control that we can interact with is critical. doing some googling on the class names I was able to find one here and that let me play with it a little, and what I discovered is that it is looking for onmousedown. so, on that site, this works
browser.li(:id, 'TabPanel1__ctl07').link(:class, 'x-tab-strip-menu').fire_event('onmousedown')
Now since those ID's may not be the best identifier, a bit more digging (using .text on the li that holds the tab parts) found me some text, which in a menu like that ought to be unique.. SO, we can change this to make things a bit more robust and clearer as to what tab I'm clicking on (this will also be less subject to breaking if the tabs change around.
browser.li(:text, 'Menu 1').link(:class, 'x-tab-strip-menu').fire_event('onmousedown')
Lastly, since the click is causing client side code to execute, you may need a brief pause (a one or two second sleep) to wait for that portion of the page to re-render etc.

how can i handle rad window popup by watir script?

How can i handle this type of Rad window pop up by using watir.
<span id="RadWindowTitlectl00_ContentPlaceHolder1_rwmWinManager_rwMessage" class="RadWTitleText" onselectstart="return false;" unselectable="on">Check Results</span>
This is for button html...
<input id="btnOk" class="LoginButton" type="button" onclick="javascript:CallBackToEdit('1');" value="Ok">
Please give guidance for this.
Need more info to help you.
If you're trying to access a newly generated popup window, do it something like this:
browser.window(:title => "annoying popup").use do
browser.button(:id => "close").click
end
Given that the HTML you have supplied just seems to be an ordinary div element, my first guess is that this is not truly any kind of popup, but just a div that is using Ajax/javascript and CSS to simulate the effect of a popup (by manipulating the coloring of objects, and perhaps the 'enabled' state as well so it appears to be modal)
To be sure we'd need to see more than just fragments of the HTML Or better yet a reference to an example of a page that implements this control. It would also be helpful to know WHICH set of 'Rad' controls (since Telerik has multiple versions (Ajax, MS-MVC, Silverlight, WPF and Winforms) available) and knowing which one might make it easier to find an example of the control on the demo pages at Telerik's site
based on what little you've provided I would think that simply
browser.button(:id, 'btnOK').click #ought to work
Note that since this thing could well be coming into existence via client side scripting, potentially a brief wait might be necessary to ensure that the object exists, before trying to click it.
If that does not work for you, then use developer tools to look at the button input element and make sure it is not in a frame.
Otherwise please give us either more HTML, specifics on which RAD control this is (so we can perhaps find an example among their demos) or both.

Resources