luckyframework / luckyframework/lucky_flow

Standardise element ID hook attribute

Open
#21 4 comments 0 reactions 0 assignees View on GitHub
discussion
Dominant language
Crystal
Stars
55
Forks
9
PR merge metrics
No merged PRs in 30d

Description

I like that Flow encourages using a custom attribute (`flow-id`) rather than regular `id` for selecting elements, as it decouples logical selection from CSS styling selection, thus should be more flexible and less brittle. But `flow-id` seems quite project specific as an attribute name (and invalid HTML markup).

1. I think it should be customisable in config for edge cases / preference. To keep existing behaviour you'd set `config.hook_attribute = "flow-id"`.
2. The default perhaps could be changed to something more standard / compatible.
3. The attribute would ideally be prefixed with `data-` to be valid markup.

Unless the HTML spec has changed to allow this, defining a custom attribute like `flow-id` is invalid markup. HTML5 provides [data attributes](http://w3c.github.io/html/single-page.html#embedding-custom-non-visible-data-with-the-data-attributes) as a valid way to do this. Angular naughtily supports `ng-*` attributes thought they also allow the valid `data-ng-*` form. There is obviously a brevity tradeoff, but I feel a framework should encourage the best practice, while optionally allowing alternate configuration to taste.

Adding an "ID-like" attribute for programatically selecting elements (rather than stylistically) seems like a common thing to do. You might do it in JS for logic. You might do it in other spec frameworks. One other example I know is [Deface](https://guides.spreecommerce.org/developer/view.html); a Ruby tool for programatically rewriting views. Deface doesn't have or enforce any custom-ID shortcut but Spree (which uses Deface heavily) has settled on `data-hook` as the preferred way of selecting elements. Perhaps LuckyFlow could use `data-hook` by default? Are there other tools that use a different `data-*` attribute for similar purpose?

FWIW I'm starting to use `data-hook` in my Rails Rspec Capybara specs.

Contributor guide

No contributing guide indexed for this repository

Research direction

The issue names no files, tests, or entry points. Resolve the configuration and default-attribute choices with maintainers before locating the hook-attribute implementation. Done means the selected attribute is configurable, the default is agreed and valid for the intended markup, and existing behavior is covered by tests.

Written by the indexing model from the issue text.

Assessment

Tech stack
crystal
Domain
testing-qa, web-dev
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
28/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.