My website works fine in Chrome.
I am trying to get it working in IE11 as well.
But see an error message at this line of code.
When i go in, i see that it is due to below line of code in paper-button element.
From past experience i know that polymer doesn't work in IE11 if i don't use colon separator and use function keyword to declare a function in javascript. e.g. as shown below.
_onDownKey: function(event) {}
I am using Polymer 1.9.3
Need guidance on understanding this new get keyword.
What is this new get keyword in front of the function name, what it does and how to make polymer elements compatible with IE11 as well if possible ?
Information about get can be found here. Obviously IE is not able to use this, thats why you have to transpile your code from es6 to javascript/es5. You can use polymer build for this. Also if you transpiled your code and if you have included the webcomponents polyfill it will work in IE11. Hope this helps!
Related
Long time automation developer here (just for context).
It's been bugging me for quite a while that the dev tools in chrome used to find elements just don't seem to work as I expect. Hopefully someone can point out what I'm doing wrong.
Looking at , say, sauce labs page: https://saucelabs.com/blog/selenium-tips-finding-elements-by-their-inner-text-using-contains-a-css-pseudo-class
ok now that page has div's and anchors
and indeed I can do find ('a') or find('div')
but why do I have a problem using classes or id's ?
The find() method refers to window.find(), a non-standard API for the browser's built-in Find function. It does not find web elements the same way Selenium or Capybara do, and so it does not parse the input as a selector.
You find elements with selectors in Chrome DevTools using document.querySelector() or document.querySelectorAll(). There are no special methods in Chrome DevTools for this, however it does provide the $() and $$() aliases (respectively) to save you time and keystrokes.
You can use jquery code in chrome console, for example if you want to find something with class of "foo" you can write $('.foo') or a id of "bar" you write $('#bar')
You can read all about it here
Also you can just google what you want "Jquery how to find a div with id"
Can a website's generated HTML be saved using Canopy? Looking at the documentation under 'Getting Started', I could not find anything related.
You can run arbitrary JavaScript using js, document.documentElement.outerHTML will return the current DOM, so
let html = js "return document.documentElement.outerHTML" |> string
does the trick.
Canopy is a wrapper around Selenium that provides some useful helper functions. But it also provides access to the Selenium IWebElement instances in case you need them, via the element function (halfway down the page; there don't seem to be internal anchors in that page so I couldn't link directly to the function). Then once you have the IWebElement object, your problem becomes similar to this one, where the answer seems to be elem.getAttribute("innerHtml") where elem is the elememt whose content you want (which might even be the html element). Note that the innerHtml attribute is not a standard DOM attribute, so this won't work with all Selenium drivers; it will be dependent on which browser you're running in. But it apparently works on all major Web browsers.
See Get HTML Source of WebElement in Selenium WebDriver using Python for a related question using Python, which has more discussion about whether the innetHtml attribute will work in all browsers. If it doesn't, Canopy also has the js function, which you could leverage to run some Javascript to get the HTML you're looking for -- but if you're having trouble with that, you probably need to ask a Javascript question rather than an F# question.
I've created a simple example http://jsbin.com/yifekigo/21/edit. It works in Chrome and does not in Firefox/Safari. It will work in Firefox if I change <nest-row mCols="{{mCols}}" y="{{y}}"></nest-row> to <nest-row mCols="4" y="{{y}}"></nest-row>.
How can I get Firefox and Safari to pass the value of mCols from nest-grid through to nest-row?
EDIT: See Scott's comment on his answer for the use of domReady as a workaround.
Sadly, on Firefox/Safari/IE, the DRY Polymer syntax is not supported in the main document. IOW, you must do:
Polymer('nest-grid', {...
instead of
Polymer({...
Again, this is only true for calls like this in the main document (which typically includes JsBin and friends). Polymer elements in imports can use the DRY syntax on all platforms.
Sorry for the trouble.
http://jsfiddle.net/AB5LK/2/
For the life of me, I can't get OverText working in the above example. I overrode the JSFiddle Mootools libraries (since they contain everything by default!) and inserted the ones I am using on my website, and have determined that the libraries are the ones causing the problems.
I use a slimmed-down MooTools library.
It looks as though while I selected OverText in the "More builder", there is still something missing in my libraries that causes the overtext to only become a label, and not a proper overtext.
Short of trial-and-error, does someone know which feature I am missing that will turn this overtext from a label on the right of the input box, to a proper OverText?
perhaps you need to reconsider your 'slimming down':
this.getStyle is not a function
[Break On This Error] return(d&&d.returnPos)?c:this.setStyle...urn this.getStyle("display")!="none";
Removing Element.Style is just silly, unless you're using MooTools for server side js like node and have no DOM.
Are there any tools out there that can look at my website HTML and tell me that (for example) "there is an HTML element at mysite.com/example.html using a class of SOMECLASS but SOMECLASS is not defined in any included CSS files".
?
I've created a snippet that does exactly that: https://gist.github.com/kdzwinel/426a0f76f113643fa285
You can run it in the DevTools console and the sample output will look like this:
You could try out a Firefox plugin like Dust-me-selectors
You could try inspecting with Firebug
There is a free Windows desktop tool that can scan a local web project folder and output undefined css classes, i.e. classes that are used in html but are not defined in any css. It also takes JavaScript into account to some degree.
https://sourceforge.net/projects/cssscanner/
All other answers either didn't work for me or didnt understand the question (including the accepted answer). This one I just tested myself and it works surprisingly well, though it won't catch every edge case.