I have a web app built using ExtJS framework.
I have a tree in my west panel, and in the center panel a TabPanel. When I click on any of the nodes on the tree in the west panel it attempts to add a form on to the center TabPanel, the following code is called:
var center = Ext.getCmp("center-panel");
var existingpanel = center.get(panelId);
if (existingpanel) {
center.setActiveTab(existingpanel);
} else {
var activeTab = center.getActiveTab();
if (!openNew && activeTab) {
var removed = center.remove(activeTab, true);
}
center.add(c);
center.setActiveTab(panelId);
center.doLayout();
}
This retrieves the current component, and then checks to see if the tab we are attempting to load exists, if it does exist then it just activates that tab, otherwise it will attempt to add a new one.
The OpenNew s just a flag that is passed in to state whether it should be opened in a new tab (for example if the user ctrl+clicks the node on tree).
Without using the OpenNew functionality (e.g. with just one tab) the form works correctly, and I can navigate between nodes with the tabs being removed/re-added correctly.
However, if I ctrl+click a node to open a second tab, the tab opens at first, so there are two tabs, but then when I select another node (so this should just remove the recently added second tab and replace it with a new tab for the new node) it just closes the second tab but fails to add the new tab.
I can't see any reason behind it as it is fien adding/removing the tabs when there is just the single tab.
There is an error in FireBug, but it doesn't offer much help:
uncaught exception: [Exception... "Could not convert JavaScript argument arg 0 [nsIDOM3Node.compareDocumentPosition]" nsresult: "0x80570009 (NS_ERROR_XPC_BAD_CONVERT_JS)" location: "JS frame :: /ext/ext-3.1.1/adapter/ext/ext-base-debug.js?d=1066331810 :: <TOP_LEVEL> :: line 1900" data: no]
-----------UPDATE:--------------
it seems to correlate to doLayout() call - if I put a doLayout() call directly after the remove() call, then it doesnt get as fat as the add() call, and if I put it after the .add() call then it half loads the new tab but stops before completing.
If I have a doLayout() call after both, then it works a little better, and I can then have two functioning tabs, but when I tried to add the third tab it displays the same behaviour as above, and closes the third tab and doesnt repopen a new one..
I have now resolved this issue - the problem was to do with the formPanels I was actually adding, whilst all the panels themselves had unique IDs I had not thought to check the IDs of other components within the form (as Jad suggests in his comments), and the forms had "FieldSets" defined with static IDs, removing those resolved the problems.
I also tested the problem in Chrome using the developer tools and found the stack trace provided a lot more useful than the error provided by FireBug, so I will be using both from now on!
Related
The Situation
I have this code below, which was working perfectly many many times the way it is, then all of a sudden it stopped working when it gets to the step of opening a new tab via javascript.
url = 'https://website'
opt = Options()
opt.add_argument('--start-maximized')
opt.add_argument("disable-infobars")
opt.add_experimental_option("detach", True)
service = Service(r'C:\Users\chromedriver_new.exe')
driver = webdriver.Chrome(options= opt,service = service)
login(url) ###function that opens the url and passes user/keyword - up to this part it's working perfectly
img_url = "https://website/" + url[30:55] + "/img.jpg" ##source of image I want to download
#The problem starts here, I've printed the img_url and I can open it fine in my navigator, but when I run the code it just stops here and never opens the new tab
#I've already tried changing the javascript by passing "+img_url+" directly
#I've also tried already to open a blank new tab and even this is not working
driver.execute_script('window.open(arguments[0],"_blank");',img_url) ###open link in new tab
time.sleep(2)
driver.switch_to.window(driver.window_handles[1]) ##change focus to new tab
time.sleep(2)
img_url_full = driver.find_element(By.XPATH,"/html/body/img").get_attribute("src") ##it gets the full path to the image, which includes a valid token that enables me to access (if I would try to downlaod the img_url directly it wouldn't work)
time.sleep(2)
urllib.request.urlretrieve(img_url_full,name) ##download image
Extra Information
I don't know if that has something to do with it, but usually my browser would always stay open unless I closed it manually (there is no close/quit on the code), but around the same time that the new tab stopped to work the browser started to close automatically right after the step of login - to avoid that I then had to add the
opt.add_experimental_option("detach", True)
(which is working).
The Question
Why is this happening and how could i debug this?
I am doing:
driver = new webdriver.Builder()
.forBrowser('safari')
.build();
var referrer = 'http://localhost:3000/tours/hood-river';
// console.log(referrer);
driver.get(referrer);
driver.findElement(By.id('requestGroupRate')).click();
//requestGroupRate is a link, so clicking it should move it to a new page
driver.wait(function(){
return driver.findElement(By.id('myThing')).then(function(element){
console.log("hereere");
assert(element.value === referrer);
done();
});
},10000);
I find that the findElement(By.id('myThing')), fails, even though the page it should be on clearly has 'myThing'. But if I change the line to
driver.findElement(By.id('requestGroupRate'))..
Then the element is found! This leads me to believe, that the click() does not cause the driver to navigate to the link.
EDIT: The link I am trying to click on:
<a id="requestGroupRate"
href="/tours/request-group-rate">Request Group Rate.</a>
you can simply add driver.sleep(10000) after click() for debug purpose.
if the page changed, means the link and click() worked and the possible failed reason it's when script click on the link, the page is still loading, so browser failed to response to the click event.
then you can move the driver.sleep(10000) after browser.get() to see click() can work or not.
As suggested by acdcjunior findout if element is clickable use browser developer tools. Chrome it is a side panel, Firefox it is a marker at the end of the HTML tag.
I have had issues getting Selenium to click on a GIS map. In that case i use an alternative (will need to translate this Java into Javascript):
((JavascriptExecutor) driver).executeScript("document.getElementById('map_container').dispatchEvent(new Event('click'));");
Also suggest testing your xpath in the browser developer console:
document.evaluate(".//tagName[#id='Query']", document,null, XPathResult.ANY_TYPE, null).iterateNext();
Or testing your cssSelector in the browser developer console:
document.querySelector('#idtext')
Trying to add a new menu item to a submenu in NW.js (Node WebKit.) Doing that with
if (this.menu.createMacBuiltin) {
this.menu.createMacBuiltin('Menu');
this.menuItem = this.menu.items[0];
isMac=true;
} else {
this.menuItem = new gui.MenuItem({label: 'Menu'});
this.menuItem.submenu = new gui.Menu();
this.menu.append(this.menuItem);
}
this.menuItemSubmenu = this.menuItem.submenu;
However, adding a menuItem dynamically like so
this.newMenuItem = new gui.MenuItem({label:'New'});
this.menuItmeSubmenu.insert(this.newMenuItem,0);
does not work for Windows, but works perfectly for Mac. When I restart the Windows app, the menu item does show up.
Why does Windows not automatically update the menu? How can I fix it?
It's a bit hard to tell since you posted only small portion of your code, and didn't mention if you use node-main in the config file.
This might be caused due to race conditions - maybe the first code runs after the second. Try to print out this.newMenuItem.items just before doing the dynamic insertion. Do you see the existing tray menu?
Try to change insert to append - did the tray menu item appear?
If both seems ok, try this workaround: instead of adding a new item, rebuild the list. First, empty it using :
for (var i = 0; i < this.newMenuItem.items.length; i++){
this.newMenuItem.removeAt(0);
}
Then use append to re-add all items. Did it work?
UPDATE
The reason I asked if you are using node-main is that when you use it, on the main script that you set as node-main, while this script is running window is not yet defined:
window: defined as a property of 'global', points to the DOM window
global object. Note that it would be updated upon page navigation.
This symbol is not available at the time the script is loaded, because
the script is executed before the DOM window load (source)
To overcome this you need to run any code that requires the window object under your main script as configured in the package.json file.
I found a way to fix it.
if (windows) {
this.refreshMenuBar();
}
refreshMenuBar = function() {
this.menu.remove(this.menuItem);
this.menu.append(this.menuItem);
win.menu = this.menu;
};
Basically, removing then adding the main menu item, then re-assigning win.menu. For some reason this updates the menu when it doesn't register a change in Windows. After removing and re-adding the entire menu, changes are displayed.
In my extension I want to open a new tab when a toolbar button is clicked (works), display a static HTML page with JavaScript on the tab (works) and pass data (URL from the originating page) to the new tab (does not work). I tried:
Using query parameters like myTab.url = safari.extension.baseURI + 'page.html?' + params, but the target page does not seem to have a location assigned (location.search giving no result).
myTab.page.dispatchMessage("url", "someUrl"); after opening the tab, but the message never arrives in the new tab (I suspect, it's already "through", when the tab has opened).
Any suggestions?
I parsed document.URL in opened page for specific parameter and it worked for me. E.g.
function __onLoad()
{
var p = $.url(document.URL);
alert(p.param("url"));
}
And two possible reasons for missed message:
You did not add message event listener on your page
You called dispatchMessage before event listener was added
Check Safari development doc at https://developer.apple.com/library/archive/documentation/Tools/Conceptual/SafariExtensionGuide/MessagesandProxies/MessagesandProxies.html
What is the proper way to close an ExtJS tab programmatically?
I need to make this work in IE6; although remove'ing the tab from the TabPanel works, I see an IE warning: This page contains secure and unsecure items... When I click the X on the tab, I do not see this warning. So, clearly something clever is happening when I click the X.
Note: the warning occurs when I use tabPanel.remove(aTab, true) and it does not occur when I use tabPanel.remove(aTab, false). So, the mixed content warning is displayed during the removal and subsequent destruction of the panel.
Does it make sense to simulate the click on a tab?
EDIT
IE is telling me I have mixed SSL content when I don't
Are you removing the tab's element directly, or are you removing the tab component from its container? E.g.:
Ext.fly('tab-id').remove(); // Element API
vs.
myTabPanel.remove('tab-id'); // Panel API
Both should work OK in terms of nuking the tab markup, but removing the element directly may have undesirable consequences. If you are doing the latter (correct), then I'm not sure what the issue might be. I don't have IE 6 handy myself.
This closes a tab by clicking the middle button of your mouse.
var middleClick = $(document).mousedown(function(e) {
if(e.which == 2){
var tabPanel = <%= tabPanel.ClientID %>;
var activeTab = tabPanel.getActiveTab();
if (e.target.textContent == activeTab.title) {
var activeTabIndex = tabPanel.items.findIndex('id', activeTab.id);
tabPanel.remove(activeTabIndex);
}
}
return true;
});
Hope it helps!! =)