adopted-ember-addons / adopted-ember-addons/ember-light-table

Unique data-test-* row attributes for ember-test-selectors

未關閉
#500 3 則留言 4 個 reaction 已指派 0 人 在 GitHub 檢視
tip
主要語言
JavaScript
星號
311
分支
130
PR 合併指標
30 天內沒有已合併 PR

描述

I'm using [ember-test-selectors](https://github.com/simplabs/ember-test-selectors/) and really prefer to select elements in my tests using those `data-test-*` selectors.

I was trying to figure out how best to get that same functionality in ember-light table. I realized that the data I was already passing to my tables already had a unique ID in all cases (globally unique ID of the data model for that row). I then realized I could just create a custom row component that automatically binds to that attribute:

`app/components/my-table/row.js`:

```js
import { readOnly } from "@ember/object/computed";
import Row from "ember-light-table/components/lt-row";

export default Row.extend({
"data-test-row-id": readOnly("row.id"),
});
```

Then when invoking the `light-table` component, I can just specify that row component:

```hbs
{{#t.body
rowComponent=(component "ac-table/row")
as |body|
}}
```

I'm posting this here not because there's an issue to resolve, but because others might find it useful. Feel free to just close this, or maybe there's something that can be added to the docs to make these sorts of customizations more discoverable.

Thanks for your work on this addon :v:

貢獻指南

開啟貢獻指南

評估

這個 Issue 還沒有評估資料。

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。