昨今のReactのテスト事情は、react-testing-library が主流です。
create-react-app でデフォルトで生成されるテストテンプレートもすでに @testing-library が使われるようになっています。
また、携わっていたプロジェクトでもenzymeからtesting-libraryに移行しました。
さて、testing-libraryでサポートされているクエリに data-testid があります。data-testidについて詳しくは、以下の記事を参考にしてください。
idやclassを使ってテストを書くのは、もはやアンチパターンである - Qiita
また、data-testidをいつ使うかについては、Testing Libraryのガイドプリンシパルが役に立ちます。
Guiding Principles · Testing Library
さて、testid 属性ですが以下のように自分で書くものですが、これを、ある程度自動的に付加できると便利かつソースコードをクリーンに保てます。
function App() {
return <div data-testid="App">App</div>
}
インストール
npm install --save-dev babel-plugin-react-data-testid
api.envを用いて、test環境だけ有効にすることをオススメします。
module.exports = api => {
const isTest = api.env("test");
return {
presets: ["react-app"],
plugins: isTest ? ["react-data-testid"] : []
};
};
これで、テスト時のみコンポーネントの最初の要素に対して、コンポーネント名でdata-testidを付加します。
すでにdata-testidがある場合は処理をスキップし、ネストしてる場合は、一番上のタグに対してdata-testidを付加します。
function App() {
return <div>App</div>
}
// ↓↓↓ テスト時のみ
function App() {
return <div data-testid="App">App</div>
}
これで、data-testidが自動生成できるようになりました。なお、クラスコンポーネントはサポートしていません。PRは歓迎です。
akameco/babel-plugin-react-data-testid: babel plugin for react data-testid attributes
バグや要望については、気軽にIssue立ててください。
使ってみていい感じだなと思ったら 
していただけると嬉しいです。