My extension is not appearing under "installed extensions" when running in debug mode (F5) in VSCode

Although the VSCode extension I'm developing works as expected so far when running with F5, it does not appear when clicking on "Extensions" in the Primary Sidebar:

If the answer is that it will come later when I learn how to package my extension for release, then how will I test if the page after clicking my extension under "INSTALLED" looks right?

package.json:

{
"name": "soliditai",
"displayName": "soliditai",
"description": "Generate tests for your Solidity contracts",
"version": "1.0.0",
"engines": {
"vscode": "^1.75.0"
},
"publisher": "Soliditai.com",
"categories": [
"Other"
],
"activationEvents": [],
"main": "./out/uploadSolidityContract.js",
"contributes": {
"commands": [
{
"command": "solidityTestGenerator.uploadSolidityContract",
"title": "Soliditai-proof-of-concept: Upload Contract"
}
],
"configuration": {
"type": "object",
"title": "Soliditai Proof-of-concept Plugin",
"properties": {
"soliditai.username": {
"type": "string",
"default": "",
"description": "Your soliditai.com username. Create a free account on https://soliditai.com/wp-login.php?action=register",
"order": 1
},
"soliditai.application-password": {
"type": "string",
"default": "",
"description": "After creating an account and logging in on the website, create an application password by scrolling to the bottom of https://soliditai.com/wp-admin/profile.php",
"order": 2
}
}
}
},
"scripts": {
"vscode:prepublish": "npm run compile",
"compile": "tsc -p ./",
"watch": "tsc -watch -p ./",
"pretest": "npm run compile && npm run lint",
"lint": "eslint src --ext ts",
"test": "node ./out/test/runTest.js"
},
"devDependencies": {
"@types/glob": "^8.1.0",
"@types/mocha": "^10.0.1",
"@types/node": "16.x",
"@types/vscode": "^1.75.0",
"@typescript-eslint/eslint-plugin": "^5.53.0",
"@typescript-eslint/parser": "^5.53.0",
"@vscode/test-electron": "^2.2.3",
"eslint": "^8.34.0",
"glob": "^8.1.0",
"mocha": "^10.2.0",
"typescript": "^4.9.5"
},
"dependencies": {
"axios": "^1.3.4"
}
}

There's also a default-generated README.md

When you debug your extension, the debugable extension is not displayed in the Extensions view. This has been working this way since the beginning (if I remember correctly) and a quick look in extension's repo, I didn't find any feature request asking for this either. Maybe you could open a Feature Request in VS Code repo, asking for this https://github.com/microsoft/vscode/issues/new/choose

About testing if your extension's page looks right, even if you have your extension already installed and you make any changes in README for the next update you want to test, the README in Extension Development Host window (the debug) won't be updated as well. Same issue as before.

To test how your extension will look, the best alternative was Extension Manifest Editor extension, developed by Microsoft itself (DevLabs in fact). But the extension has not been updated for a long time and it is not working properly anymore, based on the reviews in the Marketplace. It seems someone created an alternative extension https://marketplace.visualstudio.com/items?itemName=ms-devlabs.extension-manifest-editor&ssr=false#review-details, but I never used it to tell how precise it is.

In the end, right now, the only solution is to package the extension and install the .vsix file.

Hope this helps

If you have not installed your extension in VS Code then of course it won't show in the activity bar. When debugging it, VS Code takes care to temporarily "inject" it so that it becomes visible in the debug host (but only there).

You can actually have 2 different versions of your extension: one that you installed from the marketplace (or a local vsix file) and the other one you are debugging currently.