I'm looking for an event fired by polymer-layout when it's finished laying out, similar to the polymer-grid-layout event. Doesn't seem to be one. Am I missing something?
After my attempts at polymer-grid-layout (Autosizing canvas inside a polymer grid layout) I've decided to convert everything to nested polymer-layouts instead. After a few hiccups (e.g. the dart version of polymer-layout doesn't work if you put polymer-layout as an element directly under template, whereas the js version does - don't know which is wrong) the approach seems to be working.
The one exception is that I was previously relying on polymer-grid-layout to tell me when the canvas had been resized properly. But with polymer-layout I have the same timing problem but without the same solution it appears.
Any way around this?
thanks
Anders
Dart polymer_element/polymer_ui_element are a bit outdated. I'll take a look at what changes were be made in JS polymer-layout since I last revisited Dart polymer-layout (probably Mo/Di).
Can you please create an issue in https://github.com/ErikGrimes/polymer_elements so you get notified when the update is made.
You are right that polymer-layout is missing a layout event. I filed an issue here https://github.com/Polymer/polymer-layout/issues/3
In the meantime, you should be able to capture the timeline in attached.
attached: function() {
this.async(function() {
this.async(this.layoutHappened);
});
},
layoutHappened: function() {
}
I used nested async because I don't want to worry about whose attached is called first (this one, or the one in the polymer-layout). And yes, this is exactly the kind of fiddly construction that is avoided by having an event.
Related
I'm trying to figure out how to check whether the page has fully loaded in Playwright. await page.waitForLoadState('networkidle'); doesn't always work for me on Javascript-heavy sites. I've resorted to taking a screenshot base64, waiting 100 ms, taking a new screenshot, and comparing whether those are the same. However this doesn't seem ideal, is there any way to ask Playwright when the last animation frame was redrawn?
There are several options that may help you.
1. Solution 1:
First, you can maybe determine which element is loading last, and then go with
page.waitForSelector('yourselector')
or even wait for multiple selectors to appear
page.waitForSelector('yourselector1','yourselector2')
2. Solution 2
page.waitForLoadState('domcontentloaded')
Because
page.waitForLoadState('networkidle')
by default will wait for network event and if 0.5 seconds nothing is network trafficking it will say, I am no longer need to wait. And that is why you maybe have stohastic beh.
If the given solution doesn't work for you, you can try with locator.
page.locator(selector[, options])
It has multiple api like locator.isDisabled or locator.waitFor([options]) or locator.isVisible([options]) or locator.frameLocator(selector) ....... a lot more.
see the below link here:
https://playwright.dev/docs/api/class-locator
This is related to this post, but different in that I am trying to understand why I cannot set an outside variable from inside of geolocation.getCurrentPosition
I can't seem to get any kind of return value from it, and I can't set a value from it. I can only access the position object from inside of it. I have tried passing in this.
I forked derek-朕會功夫's fiddle and modified it:
https://jsfiddle.net/TwoFistedJustice/c3qr29L7/1/
Here is another fiddle based on this post:
https://jsfiddle.net/TwoFistedJustice/yu8Lzjvx/4/
I'm very perplexed.
Could someone please help me to:
Understand what is going on behind the scenes to make it behave it
this way.
Understand how to set a variable in an outer scope from inside
getCurrentPosition().
I've been reading up on the call stack and callback queue. And I gather that the behavior that has been perplexing me has to do with how Javascript handles the various stacks and queues. This piece by Jake Archibald helps to clear it up, though it is bit much to absorb all at once.
If I add a setTimeout with any delay value, even 0, foo is USUALLY changed. With near-zero values, it varies a bit.
setTimeout(function(){
console.log('SetTimeout\n - Foo only changes if this goes AFTER the Promise\n foo:', foo)}
, 0);
This is a fiddle derived from the others that more clearly shows what is going on. https://jsfiddle.net/TwoFistedJustice/arkqb0x8/71/
I'm using ui-grid 3.2.1.
Trying for a long time now to find an event that notifies me when rows are rendered in the DOM.
I looked a lot in SO, and in their issues in Github.
My test to see if rows are rendered is basically $('.ui-grid-row').length > 0.
I tried rowsRendered event, modifyRows(data), all sorts of $timeout(0) in almost every spot I could, nothing worked, all callbacks are called when the above jQuery still doesn't have results.
As a last resort I found a very inefficient solution - I $watch the .html() changes of .ui-grid-contents-wrapper, which contains the .ui-grid-row elements, and when I find one, I turn off the watcher and call the callback. It's bad but it works.
Note - The rows/columns somtimes contain inner directives which may take some time to render. I don't think it should influence rowsRendered() event.
Please, can anybody help with this?
No support from ui-grid team sadly.
EDIT:
plunkr that show there are no .ui-grid-row in DOM when rowsRendered() is called:
https://plnkr.co/edit/8clwC5hkwhAEjvoLZ6vO?p=preview
Try
var rows= gridApi.core.getAllVisibleRows(gridApi.grid);
inside rowsRendered function.
I believe that I have found a bug in the new _super method of jQuery UI 1.9.x but wanted to run it by you guys first before I reported it. I figure it will be an easy vote for someone out there.
Here's the ticket that I was going to submit. It details the bug:
According to the documentation, _super() takes no arguments. However,
this doesn't work as expected when used in _setOption():
http://jsfiddle.net/grinn/8jKk8/1/
As you can see by clicking the Change Text button, the value of the
text option is not updated even though _super was called properly,
according to the docs at
http://api.jqueryui.com/jQuery.widget/#method-_super
But, if you pass key and value to _super, it does work properly:
http://jsfiddle.net/grinn/8jKk8/2/
I discovered this work-around by viewing the use of _super in the
jQuery UI code, itself.
I'm submitting this as a bug and not a documentation issue because it
would seem _super is expected to work as the documentation states.
Tested in Firefox 17, Chrome 23, and IE 9.
I decided not to report this issue. Judging from the fact that inside jQuery UI they use it as I've described below, I'm thinking that the documentation is just a little vague. For those of you experiencing this same issue, the correct way to use _super appears to be to pass through your arguments, like:
_setOption: function (key, value) {
// Your code goes here...
this._super(key, value);
}
...or more generically:
_setOption: function (key, value) {
// Your code goes here...
this._superApply(arguments);
}
This is probably jquery basics, but I can't find a solution after much googling.
How do you attach "non-events" to elements inserted in the DOM?
For events, like click, we can use live() or bind().
How would you, for instance, initialize tabs() or addClass() to a new element?
Specifically, I'm trying to get tabs() to work in the content of an ajax loaded dialog, but I think the correct solution should be applicable to any situation.
I did see a trick that involved $('body').mousemove() which did work, but that is still binding to an event and obviously a hack.
For instance, how would you get addClass() to fire on a newly inserted table row?
I mean to do this implicitly, meaning that I don't want to write out specific instructions for every event that adds nodes to the dom, I just want it to "run in the background".
Let me know if this needs clarification, I see many similar questions on SO but no answers that have helped.
EDIT: Simple example: A page calls $('a').addClass('highlight') which works on all anchors in the page. A new anchor is then added to the page dynamically by jQuery, but does not get the class added.
EDIT: I have tried all kinds of bind(), trigger() and change() methods but I'm afraid I'm barking up the wrong tree.
you need to look at livequery it will allow you to apply things to newly added elements
also if your adding the element you can do
$('body')append('<div>some content</div>').tabs();
or something like that
I know that I may contradicting your "non-event" rule here, but just by saying that you want something "triggered", you're already implying some kind of event.
In that case, may I suggest jQuery custom events? You may want to create a custom event, then trigger it manually somewhere in your code. It's not automatic (like when you add a row, BOOM, it fires™), but that's the closest thing I can think of with what you were describing.
Specifically, you may want to look at jQuery's .bind() and .trigger() methods.