Using Node.js, fetching a webpage is different from on the browser

I am trying to use fetch on Node.js, to fetch the page: https://finance.yahoo.com/quote/META

I can see on the browser it is at a price of $443.29

Also if I use view-source:https://finance.yahoo.com/quote/META on the browser and set Disable JavaScript to ON on Google Chrome’s dev tool, I can see the following content:

data-field="regularMarketPrice" data-trend="none" data-pricehint="2"
data-value="443.29" active><span>443.29

However, if I do a fetch using Node.js, or even if I go to Chrome’s dev tool and the Network tab, and reload the page, and then right click on the first network resource, and right click and choose

Copy -> as fetch (Node.js)

I can get the equivalent of what Google Chrome used:

    fetch("https://finance.yahoo.com/quote/META", {
          headers: {
            accept:
              "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7",
            "accept-language":
              "en",
            "cache-control": "max-age=0",
            "sec-ch-ua":
              '"Google Chrome";v="123", "Not:A-Brand";v="8", "Chromium";v="123"',
            "sec-ch-ua-mobile": "?0",
            "sec-ch-ua-platform": '"macOS"',
            "sec-fetch-dest": "document",
            "sec-fetch-mode": "navigate",
            "sec-fetch-site": "same-origin",
            "sec-fetch-user": "?1",
            "upgrade-insecure-requests": "1",
          },
          referrerPolicy: "no-referrer-when-downgrade",
          body: null,
          method: "GET",
          mode: "cors",
          credentials: "include",
        });

However, I tried to do a JS match, and cannot get the 443.29 string, but instead, keep on getting this:

Fz(36px) Mb(-4px) D(ib)" data-symbol="META" data-test="qsp-price" 
data-field="regularMarketPrice" data-trend="none" data-pricehint="2" 
value="511.9" active="">511.90

and $511.9 was the price as of 2, 3 days ago. What is the correct way to get the price (even if it is delayed 20 minutes or a couple of hours, but not for a couple of days).

The Node.js I am using is v20.10.0, which should be quite update.

P.S. to make it into a runnable program, the following can fetch the data and match the price:

const fetch = require("node-fetch");

fetch("https://finance.yahoo.com/quote/META", {
  headers: {
    accept:
      "text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7",
    "accept-language": "en",
    "cache-control": "max-age=0",
    "sec-ch-ua":
      '"Google Chrome";v="123", "Not:A-Brand";v="8", "Chromium";v="123"',
    "sec-ch-ua-mobile": "?0",
    "sec-ch-ua-platform": '"macOS"',
    "sec-fetch-dest": "document",
    "sec-fetch-mode": "navigate",
    "sec-fetch-site": "same-origin",
    "sec-fetch-user": "?1",
    "upgrade-insecure-requests": "1",
  },
  referrerPolicy: "no-referrer-when-downgrade",
  body: null,
  method: "GET",
  mode: "cors",
  credentials: "include",
})
  .then((res) => res.text())
  .then((data) => console.log([...data.matchAll(/511..{30}/g)]));

and it will show the price match for 511. but not if I change the 511 to 443 — then it will not be able to match anything. (note that because the price change, so you may need to change to the prices later on, or you can change the last line to:

  .then((data) =>
    console.log([...data.matchAll(/36px.*regularMarketPrice.{80}/g)])
  );

instead.