Firestore Query Raises Exception if Including orderBy

user_2874028 0
Viewed 106

I have the following function:

async function loadGalleryImages2() { // load images for gallery
    const collectionRef = db.collection('projects').doc(project.id).collection('images')
    const docQuery = query(collectionRef, orderBy('displayOrder'))
}

where the declaration of docQuery causes the following error to appear in console:

Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'startAt')

If I remove the orderBy parameter as shown below, I do not get any error.

async function loadGalleryImages2() { // load images for gallery
    const collectionRef = db.collection('projects').doc(project.id).collection('images')
    const docQuery = query(collectionRef)
}

The firebase docs show similar examples so I'm not sure why this is causing errors.

google-cloud-firestore firebase javascript
1 Answers

Upon checking your code, you've used both the web version 9 (modular) and web version 8 (namespaced). I replicated your code and was able to get the same error: enter image description here

Moving forward, you must only choose one version between the two. Also, check this guide for more information in upgrading from version 8 to modular (version 9) Web SDK.

I've tried your code for both modular and namespaced using the code below:

For namespaced (web version 8):

async function loadGalleryImages2() { // load images for gallery
    const collectionRef = db.collection("projects").doc(project.id).collection("images").orderBy("displayOrder");
    collectionRef.get()
    .then((querySnapshot) => {
        querySnapshot.forEach((doc) => {
            // doc.data() is never undefined for query doc snapshots
            console.log(doc.id, " => ", doc.data());
        });
    })
    .catch((error) => {
        console.log("Error getting documents: ", error);
    });
}

And for modular (web version 9):

// Add this in your import statement if you choose to use modular version
import { getFirestore, collection, query, getDocs, onSnapshot } from "firebase/firestore";

async function loadGalleryImages2() { // load images for gallery
  const querySnapshot = await getDocs(collection(db, "projects", project.id, "images"), orderBy("displayOrder"));
  querySnapshot.forEach((doc) => {
    // doc.data() is never undefined for query doc snapshots
    console.log(doc.id, " => ", doc.data());
  });
}
user_165313800
Related