Puppeteer-WaitForSelector() with nested I frames - iframe

Puppeteer-WaitForSelector() , I have to use this function with a selector present in nested iframe. Is it possible? If not, please suggest some other alternative where I can delay my functionality based on the selector present in iframe.
I do not want to use waitFor() as I don't want to give hard coded time.
NOTE: Iframes are nested

You can iterate over page.frames() till the right iframe is found and then use frame.waitForSelector().

Related

Should I use one firebase-query and programmatically change the query parameters or is it ok to use multiple firebase-query elements in the same file?

I have multiple queries in the same polymer element that are from different location in Firebase. I am wondering if that's ok to use one firebase-query element and change the path programmatically and if yes how? I have come across this and this which seem to show some issues.
And is there a problem with using multiple firebase-query elements in the same custom element of mine?
I'm mostly looking for best practices here if there's any.
Thanks for any help.

Reusing existing Dom Elements and have them displayed in multiple sections at the same time

I was wondering if it is possible to reuse existing dom elements in html.
Not just simply move them but to display elements at the same time on multiple spots.
Like references.
I'm having the problem, that I need to display the same content multiple times, because of an responsive design.
Is it possible to achive this in a manor similiar to object orientated programming?
You cannot have "pointer" DOM elements.
You can get similar behavior if you are using GWT as you can use the element multiple times. This applies it to the page in duplicates, but has the effect you want. If you are not using GWT, you may want to look into it. It allows you to write Java and compile it into a responsive webpage (HTML & JavaScript). This lets you do OO in a clean way with your web programming.
You can also use jQuery event handlers to make object seem to be the same. For example, each button has the same effect when clicked.
Jquery could definitely do something like this. It's a javascript plugin available here. It's client-side code that allows you to manipulate dom elements.

Good reasons for using #ID's as stylistic hooks

I've read this
Why selecting by ID is not recommended in CSS?
which presents arguments for why you would use classes instead of ID's. And many dev's go cold turkey and refuse to use ID's at all for style selectors.
But, I'm sure many if not most experienced devs still use ID's as stylistic hooks(while favoring classes).
What are some possible scenarios that might justify using ID's instead of classes?
You may use ids when you are targeting unique items (you don't want to reuse that particular style) like #header,#footer.
Another good reason to use ids may be if you're a front-end developer thattakes care of some basic javascript too. Javascript access to elements via id is a lot faster than by other chained class names, so for performance reasons , you (as a js developer) might want add an id to your widget that allows you to access that element a lot faster.
For example
#widget
is faster and easier to access through js than something like
.wrapper .container .sidebar .widget:nth-child(n)
From what I've found, people (not all, but most) that try to only use class and attribute selectors make a mess of their style sheets. They end up putting a class on everything and then have long selector strings trying to move one certain element, which is where ID selectors shine. ID's were implemented into CSS for a reason and they are great when used properly.
Just use sparingly.

How to use jquery selectors on json result

I'm creating an inbox system for my website which allows basic communication between users. I'm fetching the results with jquery calling a webservice.
Then I'm using a jquery template engine to render the results to the screen. So far this all works good. but now I want to add some click functions on certain parts of inbox messages. For example I want the title of the message to be clickable so it will expand/collapse the fulltext which is hidden in a div beneath it.
But I can't seem to use the jquery selectors on this dynamic json result. It works when I put the function in the href tag itself but I don't really want to. I also tried adding the function after the success function but no luck either. Is it possible at all to use selectors with a template engine?
I hope I made myself clear otherwise feel free to ask more information. Thank you very much
Kind regards,
Mark
Have you tried jquery .live option? http://api.jquery.com/live/
I'm sorry, you'll see it happens all the time, when something goes wrong and I ask a question the minute after it it solves itselves. It is indeed possible to use the jquery selector on dynamic elements. Just make sure u put it after the template processing and in the ajax success function.
Thanks.
Are you trying to select the json that is returned from the webservice or are you trying to use the jquery selector to find an element that you added previously on to the page?

Synchronization of Iframes

I have multiple iframes which are displaying same collection of data (help in asp.net Cache).
After the modifies the data on one of the frames, I would like all of the others to reflect the update without the need for explicit postback on each one of them.
So the question is: What is the easiest and most elegant way to keep iframes synchronized in this case?
Thanks in advance
I'm yet to see an elegant iframe solution, but it's a pragmatic solutions to certain problems. Here's a few ideas:
Post your changes to the top level frame and rebuild all the frames
Use a custom javascript to update the necessary frames on changes
Use a custom javascript to update the top level frame on changes
Ok, I have implemented you second suggestion. However, in the final solution I managed to avoid usage of iframes, which is in any case much better :)
Thanks....

Resources