firebase / firebase/firebase-js-sdk

TypeScript error when using `UpdateData<T>` with composite interfaces referencing other interfaces

Open
#8,656 6 comments 0 reactions 1 assignee Claimed by @MarkDuckworth View on GitHub
api: firestore bug question stack:Vue
Dominant language
TypeScript
Stars
5.1k
Forks
1k
Avg merge
2d 21h
Merged PRs (30d)
37

Description

### Operating System

macOS Sequoia 15.1.1

### Environment (if applicable)

node

### Firebase SDK Version

11.0.2

### Firebase SDK Product(s)

Firestore

### Project Tooling

Vue 3 with Vite

### Detailed Problem Description

TypeScript throws an error when we use `UpdateData` and `T` is an interface that is a combination of other interfaces.

This example **works** because we only have a single `User` interface. It works because the `User` interface does not reference any other interfaces:

```TypeScript
interface User {
age: number;
emotion: {
happy: boolean;
sad: boolean;
};
name: string;
}

const userUpdate: UpdateData = {
age: 30,
"emotion.happy": true,
name: "Alice",
};

const userDocRef = doc(collection(db, "users", "alice"));

await updateDoc(userDocRef, userUpdate);
```

This example **does not work** because we have multiple interfaces that reference each other. Here the `User` interface is referencing the `Emotions` interface, causing the error to show:

```TypeScript
interface Emotions {
happy: boolean;
sad: boolean;
}

interface User {
age: number;
emotion: Emotions; // <-- Notice this change!
name: string;
}

const userUpdate: UpdateData = {
age: 30,
"emotion.happy": true, // <--- Error shows here
name: "Alice",
};

const userDocRef = doc(collection(db, "users", "alice"));

await updateDoc(userDocRef, userUpdate);
```

This is the TypeScript error we see:

> Object literal may only specify known properties, and '"emotion.happy"' does not exist in type '{ age?: number | FieldValue | undefined; emotion?: FieldValue | { happy?: boolean | FieldValue | undefined; sad?: boolean | FieldValue | undefined; } | undefined; name?: string | ... 1 more ... | undefined; }'.ts(2353)

Since types are often built as a composite of other types, it would be good to fix this.

### Steps and code to reproduce issue

Use the code snippets above to see the errors.

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.