Security hardening for Try Cosmos DB connection string flow (#2500)

* Security hardening for Try Cosmos DB connection string flow

- Validate connection string format via parseConnectionString before accepting postMessage
- Restrict localhost:12900 in allowedHostedExplorerEndpoints to development builds only
- Export App component for testability with null-check on render target
- Add 12 unit tests covering origin validation, format validation, and message handling

* Fix HostedExplorer test mock types for compile

---------

Co-authored-by: Asier Isayas <aisayas@microsoft.com>

src/HostedExplorer.tsx

@@ -17,6 +17,7 @@ import { FeedbackCommandButton } from "./Platform/Hosted/Components/FeedbackComm
 import { MeControl } from "./Platform/Hosted/Components/MeControl";
 import { SignInButton } from "./Platform/Hosted/Components/SignInButton";
 import "./Platform/Hosted/ConnectScreen.less";
+import { parseConnectionString } from "./Platform/Hosted/Helpers/ConnectionStringParser";
 import { isResourceTokenConnectionString } from "./Platform/Hosted/Helpers/ResourceTokenUtils";
 import { extractMasterKeyfromConnectionString } from "./Platform/Hosted/HostedUtils";
 import "./Shared/appInsights";
@@ -90,8 +91,11 @@ const App: React.FunctionComponent = () => {
       if (!allowedHostedExplorerEndpoints.includes(event.origin)) {
         return;
       }
-      if (event.data?.type === MSG_CONNECTION_STRING && event.data?.connectionString) {
-        connectWithConnectionString(event.data.connectionString);
+      if (event.data?.type === MSG_CONNECTION_STRING) {
+        const connStr: string = event.data.connectionString;
+        if (parseConnectionString(connStr)) {
+          connectWithConnectionString(connStr);
+        }
       }
     };
 
@@ -207,4 +211,9 @@ const App: React.FunctionComponent = () => {
   );
 };
 
-render(<App />, document.getElementById("App"));
+export { App };
+
+const appElement = document.getElementById("App");
+if (appElement) {
+  render(<App />, appElement);
+}