UI for Azure Cosmos DB. Powers the Azure Portal, https://cosmos.azure.com/, and the Cosmos DB Emulator (Mirror of https://github.com/Azure/cosmos-explorer)
Go to file
Laurent Nguyen 861042c27e
Fix bug publish screenshot (#762)
[Preview this branch](https://cosmos-explorer-preview.azurewebsites.net/pull/762?feature.someFeatureFlagYouMightNeed=true)

The main change in this PR fixes the snapshot functionality in the Publish pane-related components. Because the code cell outputs are now rendered in their own iframes for security reasons, a single snapshot of the notebook is no longer possible: each cell output takes its own snapshot and the snapshots are collated on the main notebook snapshot.
- Move the snapshot functionality to notebook components: this removes the reference of the notebook DOM node that we must pass to the Publish pane via explorer.
- Add slice in the state and actions in notebook redux for notebook snapshot requests and result
- Add post robot message to take snapshots and receive results
- Add logic in `NotebookRenderer` to wait for all output snapshots done before taking the main one collating.
- Use `zustand` to share snapshot between Redux world and React world. This solves the issue of keeping the `PanelContainer` component generic, while being able to update its children (`PublishPanel` component) with the new snapshot.

Additional changes:
- Add `local()` in `@font-face` to check if font is already installed before downloading the font (must be done for Safari, but not Edge/Chrome)
- Add "Export output to image" menu item in notebook cell, since each cell output can take its own snapshot (which can be downloaded)
![image](https://user-images.githubusercontent.com/21954022/117454706-b5f16600-af46-11eb-8535-6bf99f3d9170.png)
2021-05-11 18:24:05 +00:00
.github Create End to End Graph Test (#745) 2021-05-04 23:01:13 -05:00
.vs Cost Estimate Changes (#342) 2020-12-18 16:15:55 -08:00
.vscode Configure onsave auto format eslint in vscode (#478) 2021-03-09 19:31:38 -06:00
__mocks__ Clean up unused utility functions for creating databases and collections (#181) 2020-09-03 13:05:22 -07:00
canvas Remove dependency on canvas (#354) 2020-12-26 21:56:37 -06:00
configs removed enableGalleryPublish, enableLinkInjection feature flags (#454) 2021-02-26 13:07:44 -08:00
externals Add CellOutputViewer for SandboxOutputs (#686) 2021-04-22 13:37:12 -04:00
fonts/segoe-ui/west-european/normal Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
images More gallery updates (#418) 2021-02-03 23:24:27 +05:30
less Fix bug publish screenshot (#762) 2021-05-11 18:24:05 +00:00
preview Remove stfaul's subscription and account from URL (#694) 2021-04-18 11:22:27 -05:00
quickstart Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
sampleData Fix start with samples in Gremlin API (#448) 2021-02-24 12:17:15 -06:00
src Fix bug publish screenshot (#762) 2021-05-11 18:24:05 +00:00
strict-null-checks Switch to accessibility insights's version of these tools (#603) 2021-04-12 15:12:19 -05:00
test Migrate Add Database Panel to React (#597) 2021-05-10 14:02:14 -05:00
utils Fix E2E tests. Add Playwright (#698) 2021-04-19 22:08:25 -05:00
.env.example End to end testcase for mongoDb index policy (#426) 2021-02-18 05:40:58 -08:00
.eslintignore Remove old add collection pane (#767) 2021-05-10 20:10:48 -05:00
.eslintrc.js eslint switch/case exhaustiveness check rule (#739) 2021-05-04 09:12:54 -07:00
.gitignore Fix E2E tests. Add Playwright (#698) 2021-04-19 22:08:25 -05:00
.npmrc Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
CODING_GUIDELINES.md Remove IE11 from Coding Guidelines 2021-05-07 10:04:47 -05:00
CONTRIBUTING.md Update Coding Guidelines (#441) 2021-02-18 13:18:50 -06:00
DataExplorer.nuspec Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
LICENSE Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
README.md Update README.md 2021-03-27 11:18:59 -07:00
ReleaseNotes.md Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
azure-pipelines.cg.yml Update azure-pipelines.cg.yml for Azure Pipelines 2020-10-15 16:20:38 -05:00
babel.config.js Prettier 2.0 (#393) 2021-01-20 09:15:01 -06:00
copyToConsumers.js Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
jest-playwright.config.js Retry flaky tests 2021-04-21 11:01:16 -05:00
jest.config.js Upgrade Fluent UI v8 (#688) 2021-05-05 18:26:03 -05:00
jest.config.playwright.js Fix E2E tests. Add Playwright (#698) 2021-04-19 22:08:25 -05:00
mockModule.js Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
package-lock.json Fix bug publish screenshot (#762) 2021-05-11 18:24:05 +00:00
package.json Fix bug publish screenshot (#762) 2021-05-11 18:24:05 +00:00
tsconfig.contracts.json Created selfServe landing page (#444) 2021-03-10 13:55:05 -08:00
tsconfig.json Enable TypeScript `noImplicitThis` (#761) 2021-05-07 10:25:19 -05:00
tsconfig.strict.json Update strict mode files (#753) 2021-05-06 12:35:24 -05:00
tsconfig.test.json eslint switch/case exhaustiveness check rule (#739) 2021-05-04 09:12:54 -07:00
tslint.json Initial Move from Azure DevOps to GitHub 2020-05-25 21:30:55 -05:00
web.config Disable caching for config.json file (#421) 2021-02-04 15:25:13 +05:30
webpack.config.js Lazy loaded Monaco (#720) 2021-04-25 21:31:10 -07:00

README.md

Cosmos DB Explorer

UI for Azure Cosmos DB. Powers the Azure Portal, https://cosmos.azure.com/, and the Cosmos DB Emulator

Getting Started

  • npm install
  • npm run build

Developing

Watch mode

Run npm start to start the development server and automatically rebuild on changes

Hosted Development (https://cosmos.azure.com)

  • Visit: https://localhost:1234/hostedExplorer.html
  • The default webpack dev server configuration will proxy requests to the production portal backend: https://main.documentdb.ext.azure.com. This will allow you to use production connection strings on your local machine.

Emulator Development

Setting up a Remote Emulator

The Cosmos emulator currently only runs in Windows environments. You can still develop on a non-Windows machine by setting up an emulator on a windows box and exposing its ports publicly:

  1. Expose these ports publicly: 8081, 8900, 8979, 10250, 10251, 10252, 10253, 10254, 10255, 10256

  2. Download and install the emulator: https://docs.microsoft.com/en-us/azure/cosmos-db/local-emulator

  3. Start the emulator from PowerShell:

> cd C:/

> .\CosmosDB.Emulator.exe -AllowNetworkAccess -Key="<EMULATOR MASTER KEY>"

Portal Development

Testing

Unit Tests

Unit tests are located adjacent to the code under test and run with Jest:

npm run test

End to End CI Tests

Jest and Puppeteer are used for end to end browser based tests and are contained in test/. To run these tests locally:

  1. Copy .env.example to .env
  2. Update the values in .env including your local data explorer endpoint (ask a teammate/codeowner for help with .env values)
  3. Make sure all packages are installed npm install
  4. Run the server npm run start and wait for it to start
  5. Run npm run test:e2e

Releasing

We generally adhere to the release strategy documented by the Azure SDK Guidelines. Most releases should happen from the master branch. If master contains commits that cannot be released, you may create a release from a release/ or hotfix/ branch. See linked documentation for more details.

Architecture

Contributing

Please read the contribution guidelines.