cloudflare / cloudflare/workerd

BUG: Type Mismatch Between DurableObject Abstract Class and DurableObject Interface for fetch Method

Open
#2,098 3 comments 0 reactions 0 assignees View on GitHub
types
Dominant language
C++
Stars
8.7k
Forks
739
Avg merge
2d 20h
Merged PRs (30d)
174

Description

## Abstract
I recently encountered a type mismatch issue while writing test code for Cloudflare Worker's DurableObject by `@cloudflare/vitest-pool-worker`. The problem arises due to the fetch method being undefined, following the example provided in [honojs/examples](https://github.com/honojs/examples/blob/main/durable-objects/src/counter.ts) for creating a DurableObject.

## Packages
- "@cloudflare/vitest-pool-workers": "0.2.6",
- "@cloudflare/workers-types": "4.20240502.0",
- "@faker-js/faker": "~8.4.1",
- "vitest": "1.3.0",
- "wrangler": "3.53.1"

## Codes
`src/Matchmaking.ts`
```typescript:src/Matchmaking.ts
export class MatchmakingDurableObject extends DurableObject {
async addQueue(firebaseUser: FirebaseUser): Promise{
// ...
}

async removeQueue(firebaseUser: FirebaseUser): Promise{
// ...
}
}
```
`test/Matchmaking.spec.ts`
```typescript:test/Matchmaking.spec.ts
describe("MatchmakingDurableObject", () => {
it("Successful addQueue", async () => {
const id = env.MATCHMAKING.idFromName("matchmaking");
const stub = env.MATCHMAKING.get(id);
await runInDurableObject(stub, async (instance, state) => {
instance.addQueue(MockFirebaseUsers[0]);
const stored = await state.storage.get("queue");
expect(stored).toBeTypeOf("string");
const queue = JSON.parse(stored as string)
expect(queue.length).toBe(1);
})
});
});
```
`tsconfig.json`
```json:tsconfig.json
{
"compilerOptions": {
"target": "ESNext",
"module": "ESNext",
"moduleResolution": "Bundler",
"strict": true,
"skipLibCheck": true,
"lib": [
"ESNext"
],
"types": [
"@cloudflare/workers-types/experimental",
],
"jsx": "react-jsx",
"jsxImportSource": "hono/jsx"
},
}
```
`test/tsconfig.json`
```json:test/tsconfig.json
{
"extends": "../tsconfig.json",
"compilerOptions": {
"moduleResolution": "bundler",
"types": [
"@cloudflare/workers-types/experimental",
"@cloudflare/vitest-pool-workers"
]
},
"include": ["./**/*.ts", "../src/env.d.ts"]
}
```
## Error log on vscode
```
Type 'MatchmakingDurableObject' does not satisfy the constraint 'DurableObject'.
Types of property 'fetch' are incompatible.
Type '((request: Request>) => Response | Promise) | undefined' is not assignable to type '(request: Request>) => Response | Promise'.
Type 'undefined' is not assignable to type '(request: Request>) => Response | Promise'.ts(2344)
```

## Notes
This commit of the example is just 1 week ago, so I know this is the new error.
https://github.com/honojs/examples/commit/9b7acf119e874f389ca386fb2406c8f2110039e6
Temporarily I just define the fetch method on the DurableObject for the test, strangely.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.