Giters

AFASSoftware / maquette

Pure and simple virtual DOM library

Home Page:https://maquettejs.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Querying Virtual DOM elements using a css selector?

tusharmath opened this issue · comments

commented 
const vTree = h('div.landscape', [
  h('div.saucer', {style: `transform:translate(${x}px, ${y}px)`})
])

// and then search as —
maquette.find(vTree, 'div.saucer')
commented

Hello,

Querying a virtual DOM is normally only needed when doing unit testing. We created the project maquette-query for this.

This project is still in pre-release and we welcome contributions. The selector may currently only contain one part (div or .saucer) in your example.

What is your use-case for querying?

commented

I am building a DOM driver for cycle. The API looks as follow —

const click$ = DOM.select('.saucer').events('click')

Here click$ represents an Observable which emits the click event everytime the element is clicked upon.

commented

I think it would be easier if you used the afterCreate handler. This callback is meant to facilitate integration with other libraries. This function gets called with the DOM node that was created, so there is no need to find it using a query anymore. Good luck!