Firebase 9(modular sdk web ) replacement for fieldPath

I am using the below code with the Firebase SDK 8.

const db = firebase.firestore();
const collectionRef = db.collection(collectionName);

var query = collectionRef.where('isFinal', '==', true);

query = query.where(firebase.firestore.FieldPath.documentId(), 'in', docIds);
return query;

I want to replace it code with the modular SDK. So I have written,

const dbInstance = getFirestore(firebaseApp);
const collectionRef = collection(dbInstance, collectionName);
query(collectionRef, where(???, 'in', docIds));

return query;

But somehow I could not find the syntax to get the FieldPath. From the reference, I can read that,

/**
 * Returns a special sentinel `FieldPath` to refer to the ID of a document.
 * It can be used in queries to sort or filter by the document ID.
 */
export declare function documentId(): FieldPath;

which is imported with

import {documentId} from 'firebase/firestore';

But when I am using it, it results in an error.

Does anyone know what is the correct syntax for this?

Thanks

EDIT – 1 Here is the code I am using to get the documents from firestore

//docIds is an array
export const getRecordsByIds = (docIds) => {
  const promise = new Promise(async (resolve, reject) => {
    try {
      let experiences = await getByIds(docIds);
      resolve(experiences);
    } catch (error) {
      console.log(error);
      reject(error);
    }
  });
  return promise;
};

//Service 
export const getByIds = (docIds) => {
  return new Promise(async (resolve, reject) => {
    try {
      const documents = await getDocumentWithQuery(
        getByIdQuery(docIds, FirebaseCollection.Experiences)
      );
      if (documents.docs.length > 0) {
        const experiences = await parseExperience(documents.docs);
        resolve(experiences);
      } else {
        reject(docNotExistError);
      }
    } catch (error) {
      reject(error);
    }
  });
};

//Query generator
export const getByIdQuery = (docIds, collectionName) => {
  const collectionRef = collection(dbInstance, collectionName);
  console.log(docIds);
  query(collectionRef, where(documentId(), "in", docIds));
  return query;
};



//FirebaseFirestore.web.js
export const getDocumentWithQuery = (query) => {
  const promise = new Promise(async (resolve, reject) => {
    try {
      const documents = await getDocs(query);
      if (documents) {
        resolve(documents);
      } else {
        resolve({});
      }
    } catch (e) {
      console.error('Error retrieving documents: ', e);
      reject(e);
    }
  });
  return promise;
};

getRecordsByIds is the entry point.

Answer

Your syntax looks correct and is working. Just replace the ??? with documentId(). Did you forget the () by chance?

import { initializeApp } from "firebase/app";
import {
  collection,
  getFirestore,
  query,
  where,
  documentId,
  getDocs,
} from "firebase/firestore";

const firebaseConfig = {...};
initializeApp(firebaseConfig);

const dbInstance = getFirestore();
const collectionRef = collection(dbInstance, "test");

const q = query(collectionRef, where(documentId(), "in", ["test"]));
const querySnap = await getDocs(q);
console.log(querySnap.size); 

Firebase JS SDK version: 9.0.0-beta.6

The problem seems to be here:

export const getByIdQuery = (docIds, collectionName) => {
  const collectionRef = collection(dbInstance, collectionName);
  console.log(docIds);
  query(collectionRef, where(documentId(), "in", docIds));
  
  return query;
  // ^^^ You are returning the "query" function
  // imported from "firebase/firestore"
};

Assign the query to a variable and then return it:

export const getByIdQuery = (docIds, collectionName) => {
  const collectionRef = collection(dbInstance, collectionName);
  console.log(docIds);
  const newQuery = query(collectionRef, where(documentId(), "in", docIds));
  return newQuery;
};