Use get-tsconfig to parse a given tsconfig file

package.json

@@ -60,6 +60,7 @@
     "@mdn/browser-compat-data": "^4.0.0",
     "@web/dev-server-core": "^0.7.0",
     "esbuild": "^0.19.11",
+    "get-tsconfig": "^4.7.2",
     "parse5": "^6.0.1",
     "ua-parser-js": "^1.0.33"
   },

src/EsbuildPlugin.ts

@@ -18,6 +18,7 @@ import {
   setTextContent,
 } from '@web/dev-server-core/dist/dom5';
 import { parse as parseHtml, serialize as serializeHtml } from 'parse5';
+import { parseTsconfig } from 'get-tsconfig';
 
 import { getEsbuildTarget } from './getEsbuildTarget.js';
 
@@ -61,7 +62,8 @@ export class EsbuildPlugin implements Plugin {
     this.config = config;
     this.logger = logger;
     if (this.esbuildConfig.tsconfig) {
-      this.tsconfigRaw = await promisify(fs.readFile)(this.esbuildConfig.tsconfig, 'utf8');
+      const parsedTsconfig = await parseTsconfig(this.esbuildConfig.tsconfig);
+      this.tsconfigRaw = JSON.stringify(parsedTsconfig);
     }
   }
 

test/fixture/tsconfig-with-experimental-decorators-parent.json

@@ -0,0 +1,3 @@
+{
+  "extends": "./tsconfig-with-experimental-decorators.json"
+}

test/ts.test.ts

@@ -104,6 +104,61 @@ class Bar {
     }
   });
 
+  it('transforms TS decorators with parent tsconfig', async () => {
+    const { server, host } = await createTestServer({
+      rootDir: __dirname,
+      plugins: [
+        {
+          name: 'test',
+          serve(context) {
+            if (context.path === '/foo.ts') {
+              return `
+@foo
+class Bar {
+  @prop
+  x = 'y';
+}`;
+            }
+          },
+        },
+        esbuildPlugin({
+          ts: true,
+          tsconfig: path.join(
+            __dirname,
+            'fixture',
+            'tsconfig-with-experimental-decorators-parent.json',
+          ),
+        }),
+      ],
+    });
+
+    try {
+      const response = await fetch(`${host}/foo.ts`);
+      const text = await response.text();
+
+      expect(response.status).to.equal(200);
+      expect(response.headers.get('content-type')).to.equal(
+        'application/javascript; charset=utf-8',
+      );
+      expectIncludes(text, '__decorate');
+      expectIncludes(text, '__publicField(this, "x", "y");');
+      expectIncludes(
+        text,
+        `__decorateClass([
+  prop
+], Bar.prototype, "x", 2);`,
+      );
+      expectIncludes(
+        text,
+        `Bar = __decorateClass([
+  foo
+], Bar);`,
+      );
+    } finally {
+      server.stop();
+    }
+  });
+
   it('resolves relative ending with .js to .ts files', async () => {
     const { server, host } = await createTestServer({
       rootDir: path.join(__dirname, 'fixture'),