figma.currentPage is not being set as expected

Plugin and Widget API
1

As a basic example, I’m trying to create a Cover page and set that page as the Figma.currentPage. However, in the console.log of the currentPage, it still show as “Page 1” instead of “Cover”. The actual Figma app does switch to the “Cover” page, but I don’t understand why console.log is showing “Page 1” instead of “Cover” as the currentPage. This is causing frames I want to create on the “Cover” page to be created on “Page 1” instead.

What am I missing to ensure that Figma has successfully set currentPage to “Cover” before I create frames? Or is there a way to create frames directly on the “Cover” page without having to set it as the currentPage?

image
image698×202 27.2 KB

image
image696×432 35.8 KB

2

I think the weird part of this bug is it only happens the first time running the plugin on a new file? If I run it again, the issue doesn’t occur.

image
image702×438 37.6 KB

3

The output to the console occurs before the page actually switches due to asynchrony. This is where the currentpagechange event can help you.

But instead, I would create the necessary objects on the current page, and then insert them into the desired one using the appropriate methods.

4

They added page.setCurrentPageAsync() method. But that one doesn’t work properly either.

5

What does it mean? Are you waiting for the promise to complete successfully?

6

I’m struggling with this as well.
figma.currentPage doesn’t seem to be updated instantly.

figma.on("currentpagechange", () => {
  console.log("currentpagechange:", figma.currentPage.name); // never triggered
});

const page = figma.createPage();
page.name = "New page";

console.log("BEFORE:", figma.currentPage.name); // name of the previously open page
figma.currentPage = page;
console.log("AFTER:", figma.currentPage.name); // name of the previously open page

figma.closePlugin(figma.currentPage.name); // name of the previously open page

There’s also some weird behavior: after closing the plugin, the newly created page becomes the current page (as expected within plugin runtime). Additionally, without calling figma.closePlugin(), the currentpagechange event is triggered.

Note: There is no documentAccess?: 'dynamic-page' field in the manifest file.

7

Move the figma.closePlugin() call into the body of the event handler.

1 Like
8

Thanks for the idea – it’s a good one.

However, as you might guess, the plugin’s logic is much more complex, and this is just an initial step. I’ll probably need to consider something asynchronous.

I assumed figma.currentPage isn’t asynchronous, which is why I thought setCurrentPageAsync() made sense, but I’m not entirely sure that assumption is correct.

I’ll give dynamic-page a try, though I’ve run into some issues with it for now.

Thanks again for your help!

9

OK, I tried using documentAccess?: 'dynamic-page' field, but I’m still seeing the same results.

figma.on("currentpagechange", () => {
  console.log("currentpagechange:", figma.currentPage.name); // never triggered
});

async function setPage() {
  const page = figma.createPage();
  page.name = "New page";

  console.log("BEFORE:", figma.currentPage.name); // name of the previously open page
  await figma.setCurrentPageAsync(page);
  console.log("AFTER:", figma.currentPage.name); // name of the previously open page

  figma.closePlugin(figma.currentPage.name); // name of the previously open page
}

setPage();

I was under the impression that await ensures the Promise resolves before moving on, but it seems like the Promise doesn’t reflect when the page is actually set as the current page. Could it be that I need to call loadAllPagesAsync()? Any suggestions?

10

Quick update: I got confirmation on Discord that this is a bug and will be resolved soon.

For now, I’m going with this:

async function setPage() {
  const page = figma.createPage();
  page.name = "New page";

  console.log("BEFORE:", figma.currentPage.name);
  await figma.setCurrentPageAsync(page);

  await new Promise<void>((resolve) => {
    figma.on("currentpagechange", function handler() {
      console.log("currentpagechange:", figma.currentPage.name);
      figma.off("currentpagechange", handler);
      resolve();
    });
  });

  console.log("AFTER:", figma.currentPage.name);
  figma.closePlugin(figma.currentPage.name);
}

setPage();