Support react-refresh and shared client/server types (#98)

- Adds support for react-refresh through `@pmmwh/react-refresh-webpack-plugin`. Updated webpack config to support this. Means entire app is no longer refreshed on changes, only individual components, and state is maintained.
- React refresh removes need for `google-apps-script-webpack-dev-server` package
- In client code, support for server function autocomplete through use of gas-client 1.0.0. Requires certain files to be typescript .ts files
- Remove need for "global" exports in main server file through updated gas-webpack-plugin

test/local-development.test.js

@@ -18,7 +18,7 @@ const toMatchImageSnapshot = configureToMatchImageSnapshot({
   allowSizeMismatch: true,
 });
 expect.extend({ toMatchImageSnapshot });
-jest.setTimeout(120000);
+jest.setTimeout(180000);
 
 const srcTestFile = path.join(
   __dirname,
@@ -48,10 +48,11 @@ describe(`Local setup ${isExtended ? '*extended*' : ''}`, () => {
       deviceScaleFactor: 1,
     });
 
+    await webpackDevServerReady(process);
+
     if (isExtended) {
       await openAddon(page);
     } else {
-      await webpackDevServerReady(process);
       await page.goto('https://localhost:3000/dialog-demo-bootstrap.html');
       await page.waitForTimeout(3000);
     }

test/utils/open-addon.js

@@ -1,14 +1,16 @@
 const openAddon = async page => {
   await page.goto(process.env.SHEET_URL);
-  await page.waitForTimeout(5000);
 
   await page.click('a:nth-child(2)'); // click on signin button
-  await page.waitForTimeout(3000);
+
+  await page.waitForSelector('input[name="identifier"]', { visible: true });
   await page.type('input[name="identifier"]', process.env.EMAIL); // type email
   await page.click('#identifierNext'); // click "next" button
-  await page.waitForTimeout(3000);
+
+  await page.waitForSelector('input[name="password"]', { visible: true });
   await page.type('input[name="password"]', process.env.PASSWORD); // type pass
-  await page.waitForTimeout(3000);
+  await page.waitForTimeout(500);
+
   await page.click('#passwordNext'); // click "next" button
   await page.waitForTimeout(3000);
 
@@ -35,7 +37,10 @@ const openAddon = async page => {
     await page.waitForTimeout(5000);
   }
 
-  await page.waitForTimeout(25000); // wait long enough for onopen to be called
+  await page.waitForSelector(
+    'div.menu-button.goog-control.goog-inline-block:nth-child(11)',
+    { visible: true }
+  );
 
   // open new addon menubar item
   await page.evaluate(() => {
@@ -48,7 +53,10 @@ const openAddon = async page => {
     addOnMenuButton.dispatchEvent(new MouseEvent('mouseup', { bubbles: true }));
   });
 
-  await page.waitForTimeout(6000);
+  await page.waitForSelector(
+    'div.goog-menu.goog-menu-vertical.apps-menu-hide-mnemonics:last-child > div:nth-child(2) > div',
+    { visible: true }
+  );
 
   // open "bootstrap" menu item
   await page.evaluate(() => {
@@ -68,7 +76,12 @@ const openAddon = async page => {
       new MouseEvent('mouseup', { bubbles: true })
     );
   });
-  await page.waitForTimeout(10000);
+  await page.waitForSelector('.script-app-dialog', {
+    visible: true,
+    timeout: 10000,
+  });
+
+  await page.waitForTimeout(3000);
 };
 
 module.exports = { openAddon };