Explore API for child selecting

I have some code like so:

  click(
    testSelector('primitive-list-header') + ' '
      + testSelector('pointer')
  );

Thoughts about how this could get better?

[caseywatts]

On my team, we started pulling test selectors up into a simple object at the top of test files: https://gist.github.com/caseywatts/46643c9c0825c5e8b1e2542b0a150659

It’s the sort of sugar that testSelector was going for, but more explicit. You can tell exactly what’s going on from within this single file.

[Turbo87]

Just brainstorming, but what about something like this:

import { ts } from 'ember-test-selectors';

click(ts`@primitive-list-header .foo @pointer=3`);

Which would be transformed at runtime to:

click('[data-test-primitive-list-header] .foo [data-test-pointer="3"]');

I’m open to other suggestions about the prefix symbol (@), but in general this seems like a concise API that could work.