Access virtual DOM contents - elm

I wanted to implement a walkthrough tutorial but to do that I realised I needed to be able to select HTML elements from a property value (eg. name or id), ie get the value of a property from an HTML node. I think there currentlyis no way of getting an element's name in elm: could anybody please confirm? Does that mean I need to add something to virtual-dom package?

No, there is no way to really read a tree of Virtual DOM in Elm. If you look at the source for VirtualDom.elm, you'll see that nearly every function is implemented in native JavaScript, in the Native/VirtualDom.js file.
Sure, you could write some kind of native API to cheat the system and inspect the html like you're talking about, but the Virtual DOM was never meant to be used or queried in that way. The model with which you build your view should be the source of truth. Perhaps if you tweaked your design a bit, you would find that you don't really need this requirement after all.

Related

How to list the exposed members of a package/dir-like method in Elm?

I have been searching the official docs and existing questions and could not find any information on this - in Elm, how it would be possible to see the members/methods/variables that belong to or are exposed by a package in Elm, (such as the dir method in python), without having to dive into the source code each time?
What I want to do is get a simple list of what methods are exposed by an imported package. (So for a package like List, it should output reverse , all, any, map, etc.) I have attempted tab completion in elm repl and the elm extension available in VS code editor, and elm repl does not offer any methods such as help, doc, ?, dir, man, etc., so I have no idea where to even start. I'm wondering how everyone else does this other than pulling up the source code for each and every package they use.
I apologize for the newbie question and if I misread or have been missing anything, but I couldn't even find anything in the https://elmprogramming.com tutorial. Thanks in advance.
Nothing like this exists in Elm to do reflection over modules, unfortunately (as of 0.19.1, at least).
However, if you aren't looking to actually do this kind of thing at runtime, but rather as a convenient way of finding out for development, the elm packaging system enforces the requirement that all public functions are documented, so if you visit the package page, every public function and type will be documented there (obviously it can't enforce the content of the documentation, but at the very least it will be listed).

Access closure property names in the content block at runtime

I want to evaluate my content blocks before running my test suite but the closures' property names is in bytecode already. I'm ooking for the cleanest solution (compared with parsing source manually).
Already tried solution outlined in this post (and I'd still wind up doing some RegEx/parsing) but could only get it to work via script execution engine. It failed in IDE and GroovyConsole. Rather than embedding a Groovy script in project's code, I thought I'd try using Geb's native classes.
Is building on the suggestion about extending Geb Navigators here viable for Geb's PageContentSupport class whose contentTemplates contain a LinkedHashMap of exactly what I need? If yes, would someone provide guidance? If no, any suggestions?
It is currently not possible to get hold of all content elements for a given page/module. Feel free to create an issue for this in Geb's bug tracker, but remember that all that Geb can provide is either a list of content element names or a map from these names to closures that create these elements.
Having that information isn't a generic solution to your problem because it's possible for content elements to take parameters and there are situations where your content elements will be available on the page only after some other actions are performed (for example you have to click on button to reveal a section of a page that uses ajax to retrieve it's content). So I'm afraid that simply going over all elements and checking if they don't throw any errors will not cut it.
I'm still struggling to see what would "evaluating" all content elements prior to running the suite buy you. Are you after verifying that your content elements still work to get a faster feedback than running the whole suite? I'm pretty sure that you won't be able to fully automate detection of content definitions that don't work anymore. In my view it will be more effort than it's worth.

Capturing variable xpath in selenium IDE

Am trying to capture a element (delete button in gmail) which has variable xpath.
The xpath is something like this-
//*[#id=':rr']/div/div[4]/div[1]/div[1]/div[1]/div/div/div[2]/div[3]
can somebody kindly help?
No, this is where the IDE falls behind and it's for good reason. It, along with other 'XPath-ified' (e.g using the 'XPath' right-click option in Firebug) tools will only take a guess at where something is located in the DOM.
In that, I mean it's going to walk down the tree and see where it is, in relation to the other elements, i.e it'll walk down one set of tr elements, and know there are 7 of them, therefore it'll know that the first one can be accessed using [1], then the next one can be accessed using [2] etc etc...
It doesn't, or really can't, know what is unique enough for you to use. That's why it's down to you to figure it out.
As for Gmail specifically, I would suggest you either fall back to Gmail's basic mode - so the markup will be easier to deal with or stop completely and use a particular set of API's in whatever language you are using to deal direct with the mailboxes in that account.
Though, if you do this, you'll need to dump the IDE altogether - essentially this is beyond the IDE and is a logical thing you need to decide yourself. The IDE is not designed for this.
Though, a tip would be see what's near the delete button. Is there a static element, that has the same attributes all the time, near it? You can get that element, and walk through to the DOM to your 'delete button'.

confusion in using YII CHtml::link and CHtml::image instead of HTML

I have started an application in YII, I want to use proper standards of YII but am just bit curious about the use of its CHTML Class. I think that using CHtml::link() or CHtml::image() instead of normal HTML code <a></a> and <img src... /> will cost more time to application on server side. I tried to look for some reason to use it but yet not success in finding any good resource on why should I use it and how its beneficial then traditional HTML. Like I can use all those methods for defining paths to actions in normal HTML code then why use it
any help or reference for clarification would be appreciated
Thanks
Let's talk about CHtml::link(). Its main advantage is that you can indicate a controller route and send some get variables by simply passing an array as paramater. Lets say you wanna go to the eat() action of your LivingController, with the variable 'meal' and its value being 'hamburgers'. It could simply be done like this:
> CHtml::link(array('LivingController/eat', 'meal'=>'hamburgers'));
If you want to express this using <a></a> only, then I don't need to tell you how much harder it would be. In addition, we should remember that a link generated using CHtml::link() will always work, even if you change the url format. That wouldn't happen with <a></a>: you would have to rewrite the url every time you change the url format.
The advantages of CHtml::image() are less clear, at least to me. Sincerely, I think it's just a matter of encapsulation.

Accessing model attribute from css/less file with Rails 3

The project I'm working on requires me to adapt the size of the elements on screen according to per-user setting. We're using Twitter bootstrap, so my first idea was to toy with the #basefont value, and it seems to do the trick.
However, I don't know how to access the user setting from the .less file. I tried using erb with .less.erb, but it looks like I don't have access to any code in my application.
Is there a way to get the value I'm looking for from the .less file, or - even better - a proper way to do this ?
Thanks for your time.
EDIT
Since I need to get the value at runtime, the way I tried won't work anyway, though I'm still interested on an answer. The only way I see to do what I want is to add a class according to the user setting. Again, I'd be glad to have alternatives.
I opted for css3 transform (and vendors implementation) property. It does the job, but seems to hit the GPU quite a lot. So still open to other answers. :)