Skip to content
This repository has been archived by the owner on Nov 6, 2024. It is now read-only.

Daydream generates extreme selectors #21

Open
kokujin opened this issue Jan 21, 2016 · 8 comments
Open

Daydream generates extreme selectors #21

kokujin opened this issue Jan 21, 2016 · 8 comments

Comments

@kokujin
Copy link

kokujin commented Jan 21, 2016

Is there a way to shorten the selectors generated by Daydream? Or a way to let Daydream know when to generate relative selector paths? Here is a snippet of a generated click:

.click(
            'html..js.flexbox.flexboxlegacy.canvas.canvastext.webgl.no-touch.geolocation.postmessage.websqldatabase.indexeddb.hashchange.history.draganddrop.websockets.rgba.hsla.multiplebgs.backgroundsize.borderimage.borderradius.boxshadow.textshadow.opacity.cssanimations.csscolumns.cssgradients.cssreflections.csstransforms.csstransforms3d.csstransitions.fontface.generatedcontent.video.audio.localstorage.sessionstorage.webworkers.applicationcache.svg.inlinesvg.smil.svgclippaths body div.header-nav div.container div.top-main-nav.navbar.navbar-inverse div.navbar-inner.container div.nav-collapse.collapse ul#megamenu.nav li#toys.dropdown.main-nav-item.mmenu-item.activated a.main-nav-item'
        )

This was generated by clicking the "issues" link in this github repositoty:

click('html..is-copy-enabled.is-u2f-enabled body.logged_in.env-production.macintosh.vis-public div.main-content div div#js-repo-pjax-container.context-loader-container.js-repo-nav-next div.pagehead.repohead.instapaper_ignore.readability-menu.experiment-repo-nav div.container nav.reponav.js-repo-nav.js-sidenav-container-pjax.js-octicon-loaders a.js-selected-navigation-item.reponav-item')

This is huge und unnecessary. Any ideas? Thanks

@stevenmiller888
Copy link

@kokujin Do you have a better idea for ensuring a unique path to the element? I'm sure there's a smarter way to do it, just haven't had time to think it over.

@michalbe
Copy link
Contributor

Maybe it would be smart to introduce a configuration where you can specify how the selectors will be calculated? With options like:

  • the dept of the selector - something like up to lvl 3 parents, etc.
  • list of classes to ignore
  • ignore parents at all if there is an id attr

@kokujin
Copy link
Author

kokujin commented Feb 29, 2016

I think that would open a can of worms @michalbe , It would be best it it would just automatically generate the shortest, most optimized selector.

Think about the scenario of allowing non technical users in a QA department.

@kokujin
Copy link
Author

kokujin commented Feb 29, 2016

Have you thought about using a third party lib to generate the electors @stevenmiller888 ? for example, https://www.npmjs.com/package/css-selector-generator, from the description:

it also generates shorter selectors and is faster and/or more robust than many other libraries - see this comparison and select the best alternative for your use case.

@kokujin
Copy link
Author

kokujin commented Feb 29, 2016

https://github.com/autarc/optimal-select is also an option to generate short selectors

@michalbe
Copy link
Contributor

Not sure if the first one is a good choice, apparently the lib has some infinite loops bugs inside.

There is a benchmark for this already: css-selector-generator-benchmark

@justsml
Copy link

justsml commented Nov 26, 2016

RE @michalbe I'd love to also specify a black list of selectors.
A few "bad" selectors mess really mess my tests up.

@roryrjb
Copy link
Contributor

roryrjb commented Aug 4, 2017

@stevenmiller888 the pull request #32 has already solved this and I think this can be closed. In all my testing I haven't experienced any issues with long selectors.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants