Add test for React DevTools

Author: jhen0409

__e2e__/TestApp/__e2e__/app.spec.js

@@ -15,9 +15,10 @@ describe('Main', () => {
     expect(title).toBe('React Native Debugger - Connected (port 8081)');
   });
 
+  const delay200 = () => delay(200);
+  const delay500 = () => delay(500);
+
   describe('Context Menu', () => {
-    const delay200 = () => delay(200);
-    const delay500 = () => delay(500);
     it('should show AsyncStorage content as expected', async () => {
       const { client } = rndebugger;
       await client.execute(() => window.invokeDevMethod('showAsyncStorage')).then(delay200);
@@ -43,10 +44,9 @@ describe('Main', () => {
         .tap()
         .then(delay500);
 
-      await client.execute(() => window.invokeDevMethod('clearAsyncStorage')).then(delay200);
+      await client.execute(() => window.invokeDevMethod('clearAsyncStorage')).then(delay500);
       await client.execute(() => window.invokeDevMethod('showAsyncStorage')).then(delay200);
       const logs = await client.getRenderProcessLogs();
-      // Print renderer process logs
       expect(
         logs.some(log => log.message.indexOf('[RNDebugger] No AsyncStorage content.') > -1)
       ).toBeTruthy();
@@ -64,7 +64,6 @@ describe('Main', () => {
 
       await client.execute(() => window.invokeDevMethod('networkInspect')).then(delay200);
       const logs = await client.getRenderProcessLogs();
-      // Print renderer process logs
       expect(
         logs.some(
           log =>
@@ -74,4 +73,32 @@ describe('Main', () => {
       ).toBeTruthy();
     });
   });
+
+  describe('React DevTools', () => {
+    const waitingForReactConnect = client =>
+      client.waitUntilTextExists(
+        '#react-devtools-container > div > div:nth-child(1) > ul > li:nth-child(1)',
+        'Elements',
+        1000
+      );
+
+    it('should connected to React DevTools', async () => {
+      const { client } = rndebugger;
+      await waitingForReactConnect(client);
+    });
+
+    it('should reconnect to React DevTools if open the tab', async () => {
+      const { client } = rndebugger;
+      await waitingForReactConnect(client);
+      await rndebugger.webContents.send('toggle-devtools', 'react').then(delay500);
+
+      const logs = await client.getRenderProcessLogs();
+      expect(logs.some(log => log.message.indexOf('closing devtools') > -1)).toBeTruthy();
+
+      await rndebugger.webContents.send('toggle-devtools', 'react').then(() => delay(2000));
+
+      await client.getRenderProcessLogs();
+      await waitingForReactConnect(client);
+    });
+  });
 });