Reopening InDesign after installing my plugin and the plugin won't load

UXP Developer Tool
,
1

I’m been making a react-based plugin for indesign and haven’t had trouble loading the plugin in UDT. Load, load and watch, debug, all that works fine through UDT. Installing the plugin by double-clicking the ccx also has no issues. It loads up as expected both in the CC app and in the Plugins dropdown of InDesign. The problem arises when i close InDesign and reopen it, the plugin never loads; the panel is just empty with the name on the tab.

Has anyone experienced this or know of a solution? I’m not sure how to debug an already installed plugin. I’ll included my manifest.json, index.jsx, and package.json below, with some data blocked out.

// manifest.json
{
    "id": "XXXXXX",
    "name": "XXXXXX",
    "version": "2.0.0",
    "main": "index.html",
    "manifestVersion": 5,
    "host": {
        "app": "ID",
        "minVersion": "20.0.0"
    },
    "entrypoints": [
        {
            "type": "panel",
            "id": "XXXXXX",
            "label": {
                "default": "XXXXXX"
            },
            "minimumSize": {
                "width": 230,
                "height": 200
            },
            "maximumSize": {
                "width": 2000,
                "height": 2000
            },
            "preferredDockedSize": {
                "width": 230,
                "height": 250
            },
            "preferredFloatingSize": {
                "width": 230,
                "height": 250
            },
            "icons": [
                {
                    "width": 23,
                    "height": 23,
                    "path": "icons/XXXXXXBookIcon.png",
                    "scale": [1, 2],
                    "theme": ["all"],
                    "species": ["generic"]
                }
            ]
        }
    ],
    "icons": [
        {
            "width": 23,
            "height": 23,
            "path": "icons/XXXXXXBookIcon.png",
            "scale": [1, 2],
            "theme": ["all"],
            "species": ["generic"]
        }
    ],
    "requiredPermissions": {
        "network": {
            "domains": ["https://feeds.dev.azure.com/"]
        },

        "launchProcess": {
            "schemes": ["http", "https", "mailto"],
            "extensions": ["ccx", ".ccx", ""]
        },
        "localFileSystem": "fullAccess"
    },
    "featureFlags": {
        "enableAlerts": true
    }
}

// index.jsx

import React from "react"

import { PanelController } from "./controllers/PanelController.jsx"

import { entrypoints } from "uxp"
import Home from "./panels/Home"
import openTempAndGuides from "./Templates and Guides/openTempAndGuides.js"
import update from "./components/update/update.js"

const index_AR_Controller = new PanelController(() => <Home />, {
    id: "index_AR",
    menuItems: [
        { id: "version", label: `Plugin Version: ${version}`, oninvoke: () => console.log(version) },
        { id: "install", label: `Update`, oninvoke: update },
        { id: "templates", label: `Templates and Guides`, oninvoke: openTempAndGuides },
    ],
})

entrypoints.setup({
    plugin: {
        create(plugin) {
            /* optional */ console.log("created")
        },
        destroy() {
            /* optional */ console.log("destroyed")
        },
    },
    panels: {
        index_AR: index_AR_Controller,
    },
})

// package.json
{
    "name": "com.adobe.uxp.starter.react.id",
    "version": "1.0.0",
    "scripts": {
        "watch": "nodemon -w src -e js,jsx,json,css,html -w webpack.config.js -x npm run build",
        "build": "webpack --mode development",
        "uxp:load": "cd dist && uxp plugin load",
        "uxp:reload": "cd dist && uxp plugin reload",
        "uxp:watch": "cd dist && nodemon --exec \"uxp plugin reload\" -e js,css,html",
        "uxp:debug": "cd dist && uxp plugin debug"
    },
    "author": "Adobe Inc",
    "license": "Apache-2.0",
    "devDependencies": {
        "@babel/core": "^7.8.7",
        "@babel/plugin-proposal-object-rest-spread": "^7.8.3",
        "@babel/plugin-syntax-class-properties": "^7.10.4",
        "@babel/plugin-transform-react-jsx": "^7.8.3",
        "babel-loader": "^8.0.6",
        "clean-webpack-plugin": "^2.0.2",
        "copy-webpack-plugin": "^5.0.3",
        "css-loader": "^6.8.1",
        "file-loader": "^5.1.0",
        "nodemon": "^2.0.7",
        "style-loader": "^1.1.3",
        "webpack": "^5.88.1",
        "webpack-cli": "^5.1.4"
    },
    "dependencies": {
        "@tanstack/react-query": "^5.61.4",
        "fs": "^0.0.1-security",
        "lucide-react": "^0.453.0",
        "react": "^18.3.1",
        "react-dom": "^18.3.1"
    },
    "resolutions": {
        "acorn": "npm:acorn-with-stage3"
    }
}
2

As usual as soon as i post something i make some headway. I remembered about the UDT app logs which seems to point to some places where i am referencing the activeDocument when there are no documents open causing the issue. Whats the best way to guard against this error before it happens? Generally i am using syntax like this to assign the active doc to a const:

const { app } = require("indesign")
const doc = app.activeDocument

it seems like i’ll need to move that doc const into my functions, and return if no activeDocument is present but then i fear that it won’t pick up on a document being opening and rerender the ui.

3

Never mind, once again i’m dumb. I just needed to make sure all the const doc = app.activeDocument appeared in functions. At the top level it makes them globally scoped and therefor tries to access them as soon as the plugin is loaded, where a document might not be present.