Bump minimist from 1.2.5 to 1.2.8

Bumps [minimist](https://github.com/minimistjs/minimist) from 1.2.5 to 1.2.8.
- [Release notes](https://github.com/minimistjs/minimist/releases)
- [Changelog](https://github.com/minimistjs/minimist/blob/main/CHANGELOG.md)
- [Commits](https://github.com/minimistjs/minimist/compare/v1.2.5...v1.2.8)

---
updated-dependencies:
- dependency-name: minimist
  dependency-type: indirect
...

Signed-off-by: dependabot[bot] <support@github.com>

images/imgarrowlefticon.svg

@@ -1,5 +1,5 @@
 <?xml version="1.0" ?>
 <!DOCTYPE svg  PUBLIC '-//W3C//DTD SVG 1.1//EN'  'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'>
 <svg enable-background="new 0 0 256 256" height="256px" id="Layer_1" version="1.1" viewBox="0 0 256 256" width="256px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
-<path stroke="white" stroke-width="0.5" fill="#000" d="M179.199,38.399c0,1.637-0.625,3.274-1.875,4.524l-85.076,85.075l85.076,85.075c2.5,2.5,2.5,6.55,0,9.05s-6.55,2.5-9.05,0  l-89.601-89.6c-2.5-2.5-2.5-6.551,0-9.051l89.601-89.6c2.5-2.5,6.55-2.5,9.05,0C178.574,35.124,179.199,36.762,179.199,38.399z"/>
+<path stroke="white" stroke-width="0.5" fill="#b5a3a3" d="M179.199,38.399c0,1.637-0.625,3.274-1.875,4.524l-85.076,85.075l85.076,85.075c2.5,2.5,2.5,6.55,0,9.05s-6.55,2.5-9.05,0  l-89.601-89.6c-2.5-2.5-2.5-6.551,0-9.051l89.601-89.6c2.5-2.5,6.55-2.5,9.05,0C178.574,35.124,179.199,36.762,179.199,38.399z"/>
 </svg>

less/documentDB.less

@@ -2576,10 +2576,6 @@ a:link {
 .querydropdown.placeholderVisible {
   font-style: italic;
 }
-.querydropdown.placeholderVisible::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
-  color: #403f3f;
-  opacity: 1; 
-}
 
 .querydropdown:hover {
   background-color: @AccentLow;
@@ -3091,4 +3087,3 @@ a:link {
   background: white;
   height: 100%;
 }
-

src/Common/EnvironmentUtility.test.ts

@@ -1,14 +0,0 @@
-import * as EnvironmentUtility from "./EnvironmentUtility";
-
-describe("Environment Utility Test", () => {
-  it("Test sample URI with /", () => {
-    const uri = "test/";
-    expect(EnvironmentUtility.normalizeArmEndpoint(uri)).toEqual(uri);
-  });
-
-  it("Test sample URI without /", () => {
-    const uri = "test";
-    const expectedResult = "test/";
-    expect(EnvironmentUtility.normalizeArmEndpoint(uri)).toEqual(expectedResult);
-  });
-});

src/Common/OfferUtility.test.ts

@@ -1,6 +1,6 @@
-import { OfferResponse } from "@azure/cosmos";
-import { Offer, SDKOfferDefinition } from "../Contracts/DataModels";
 import * as OfferUtility from "./OfferUtility";
+import { SDKOfferDefinition, Offer } from "../Contracts/DataModels";
+import { OfferResponse } from "@azure/cosmos";
 
 describe("parseSDKOfferResponse", () => {
   it("manual throughput", () => {
@@ -31,26 +31,6 @@ describe("parseSDKOfferResponse", () => {
     expect(OfferUtility.parseSDKOfferResponse(mockResponse)).toEqual(expectedResult);
   });
 
-  it("offerContent not defined", () => {
-    const mockOfferDefinition = {
-      id: "test",
-    } as SDKOfferDefinition;
-
-    const mockResponse = {
-      resource: mockOfferDefinition,
-    } as OfferResponse;
-
-    expect(OfferUtility.parseSDKOfferResponse(mockResponse)).toEqual(undefined);
-  });
-
-  it("offerDefinition is null", () => {
-    const mockResponse = {
-      resource: undefined,
-    } as OfferResponse;
-
-    expect(OfferUtility.parseSDKOfferResponse(mockResponse)).toEqual(undefined);
-  });
-
   it("autoscale throughput", () => {
     const mockOfferDefinition = {
       content: {

src/Common/TableEntity.tsx

@@ -137,16 +137,15 @@ export const TableEntity: FunctionComponent<TableEntityProps> = ({
         />
         {!isEntityValueDisable && (
           <TooltipHost content="Edit property" id="editTooltip">
-            <div tabIndex={0}>
-              <Image
-                {...imageProps}
-                src={EditIcon}
-                alt="editEntity"
-                onClick={onEditEntity}
-                tabIndex={0}
-                onKeyPress={handleKeyPress}
-              />
-            </div>
+            <Image
+              {...imageProps}
+              src={EditIcon}
+              alt="editEntity"
+              id="editEntity"
+              onClick={onEditEntity}
+              tabIndex={0}
+              onKeyPress={handleKeyPress}
+            />
           </TooltipHost>
         )}
         {isDeleteOptionVisible && userContext.apiType !== "Cassandra" && (

src/Common/UrlUtility.test.ts

@@ -1,49 +0,0 @@
-import * as UrlUtility from "./UrlUtility";
-
-describe("parseDocumentsPath", () => {
-  it("empty resource path", () => {
-    const resourcePath = "";
-
-    expect(UrlUtility.parseDocumentsPath(resourcePath)).toEqual({});
-  });
-
-  it("resourcePath does not begin or end with /", () => {
-    const resourcePath = "localhost/portal/home";
-    const expectedResult = {
-      type: "home",
-      objectBody: {
-        id: "portal",
-        self: "/localhost/portal/home/",
-      },
-    };
-
-    expect(UrlUtility.parseDocumentsPath(resourcePath)).toEqual(expectedResult);
-  });
-
-  it("resourcePath length is even", () => {
-    const resourcePath = "/localhost/portal/src/home/";
-    const expectedResult = {
-      type: "src",
-      objectBody: {
-        id: "home",
-        self: resourcePath,
-      },
-    };
-
-    expect(UrlUtility.parseDocumentsPath(resourcePath)).toEqual(expectedResult);
-  });
-
-  it("createUri", () => {
-    const baseUri = "http://foo.com/bar/";
-    const relativeUri = "/index.html";
-    const expectedUri = "http://foo.com/bar/index.html";
-
-    expect(UrlUtility.createUri(baseUri, relativeUri)).toEqual(expectedUri);
-  });
-
-  it("should throw an error if baseUri is empty", () => {
-    expect(() => {
-      UrlUtility.createUri("", "/home");
-    }).toThrow("baseUri is null or empty");
-  });
-});

src/Explorer/Controls/Tabs/TabComponent.tsx

@@ -46,13 +46,10 @@ export class TabComponent extends React.Component<TabComponentProps> {
       }
 
       let className = "toggleSwitch";
-      let ariaselected;
       if (index === this.props.currentTabIndex) {
         className += " selectedToggle";
-        ariaselected = true;
       } else {
         className += " unselectedToggle";
-        ariaselected = false;
       }
 
       return (
@@ -60,10 +57,9 @@ export class TabComponent extends React.Component<TabComponentProps> {
           <AccessibleElement
             as="span"
             className={className}
-            role="tab"
+            role="presentation"
             onActivated={() => this.setActiveTab(index)}
             aria-label={`Select tab: ${tab.title}`}
-            aria-selected={ariaselected}
           >
             {tab.title}
           </AccessibleElement>
@@ -81,11 +77,7 @@ export class TabComponent extends React.Component<TabComponentProps> {
 
     return (
       <div className="tabComponentContainer">
-        {!this.props.hideHeader && (
-          <div className="tabs tabSwitch" role="tablist">
-            {this.renderTabTitles()}
-          </div>
-        )}
+        {!this.props.hideHeader && <div className="tabs tabSwitch">{this.renderTabTitles()}</div>}
         <div className={className}>{currentTabContent.render()}</div>
       </div>
     );

src/Explorer/Controls/ThroughputInput/ThroughputInput.test.tsx

@@ -23,12 +23,12 @@ describe("ThroughputInput Pane", () => {
   });
 
   it("should switch mode properly", () => {
-    wrapper.find('[id="Manual-input"]').simulate("change");
+    wrapper.find('[aria-label="Manual database throughput"]').simulate("change");
     expect(wrapper.find('[aria-label="Throughput header"]').at(0).text()).toBe(
       "Container throughput (400 - unlimited RU/s)"
     );
 
-    wrapper.find('[id="Autoscale-input"]').simulate("change");
+    wrapper.find('[aria-label="Autoscale database throughput"]').simulate("change");
     expect(wrapper.find('[aria-label="Throughput header"]').at(0).text()).toBe("Container throughput (autoscale)");
   });
 });

src/Explorer/Controls/ThroughputInput/ThroughputInput.tsx

@@ -185,52 +185,48 @@ export const ThroughputInput: FunctionComponent<ThroughputInputProps> = ({
       </Stack>
 
       <Stack horizontal verticalAlign="center">
-        <div role="radiogroup">
-          <input
-            id="Autoscale-input"
-            className="throughputInputRadioBtn"
-            aria-label={`Autoscale` + " " + getThroughputLabelText()}
-            aria-required={true}
-            checked={isAutoscaleSelected}
-            type="radio"
-            role="radio"
-            tabIndex={0}
-            onChange={(e) => handleOnChangeMode(e, "Autoscale")}
-          />
-          <label htmlFor="Autoscale-input" className="throughputInputRadioBtnLabel">
-            Autoscale
-          </label>
+        <input
+          id="Autoscale-input"
+          className="throughputInputRadioBtn"
+          aria-label="Autoscale database throughput"
+          aria-required={true}
+          checked={isAutoscaleSelected}
+          type="radio"
+          role="radio"
+          tabIndex={0}
+          onChange={(e) => handleOnChangeMode(e, "Autoscale")}
+        />
+        <label htmlFor="Autoscale-input" className="throughputInputRadioBtnLabel">
+          Autoscale
+        </label>
 
-          <input
-            id="Manual-input"
-            className="throughputInputRadioBtn"
-            aria-label={`Manual` + " " + getThroughputLabelText()}
-            checked={!isAutoscaleSelected}
-            type="radio"
-            aria-required={true}
-            role="radio"
-            tabIndex={0}
-            onChange={(e) => handleOnChangeMode(e, "Manual")}
-          />
-          <label className="throughputInputRadioBtnLabel" htmlFor="Manual-input">
-            Manual
-          </label>
-        </div>
+        <input
+          id="Manual-input"
+          className="throughputInputRadioBtn"
+          aria-label="Manual database throughput"
+          checked={!isAutoscaleSelected}
+          type="radio"
+          aria-required={true}
+          role="radio"
+          tabIndex={0}
+          onChange={(e) => handleOnChangeMode(e, "Manual")}
+        />
+        <label className="throughputInputRadioBtnLabel" htmlFor="Manual-input">
+          Manual
+        </label>
       </Stack>
 
       {isAutoscaleSelected && (
         <Stack className="throughputInputSpacing">
           <Text variant="small" aria-label="capacity calculator of azure cosmos db">
             Estimate your required RU/s with{" "}
-            <u style={{ color: "#0078D4" }}>
-              <Link
-                target="_blank"
-                href="https://cosmos.azure.com/capacitycalculator/"
-                aria-label="capacity calculator of azure cosmos db"
-              >
-                capacity calculator
-              </Link>
-            </u>
+            <Link
+              target="_blank"
+              href="https://cosmos.azure.com/capacitycalculator/"
+              aria-label="capacity calculator of azure cosmos db"
+            >
+              capacity calculator
+            </Link>
             .
           </Text>
 
@@ -251,9 +247,8 @@ export const ThroughputInput: FunctionComponent<ThroughputInputProps> = ({
             onChange={(event, newInput?: string) => onThroughputValueChange(newInput)}
             step={AutoPilotUtils.autoPilotIncrementStep}
             min={AutoPilotUtils.autoPilotThroughput1K}
-            max={!isSharded ? 10000 : 9000000000000}
             value={throughput.toString()}
-            ariaLabel="Max request units per second"
+            aria-label="Max request units per second"
             required={true}
             errorMessage={throughputError}
           />
@@ -273,11 +268,9 @@ export const ThroughputInput: FunctionComponent<ThroughputInputProps> = ({
         <Stack className="throughputInputSpacing">
           <Text variant="small" aria-label="ruDescription">
             Estimate your required RU/s with&nbsp;
-            <u style={{ color: "#0078D4" }}>
-              <Link target="_blank" href="https://cosmos.azure.com/capacitycalculator/" aria-label="capacityLink">
-                capacity calculator
-              </Link>
-            </u>
+            <Link target="_blank" href="https://cosmos.azure.com/capacitycalculator/" aria-label="capacityLink">
+              capacity calculator
+            </Link>
             .
           </Text>
 
@@ -300,7 +293,7 @@ export const ThroughputInput: FunctionComponent<ThroughputInputProps> = ({
               min={SharedConstants.CollectionCreation.DefaultCollectionRUs400}
               max={userContext.isTryCosmosDBSubscription ? Constants.TryCosmosExperience.maxRU : Infinity}
               value={throughput.toString()}
-              ariaLabel="Max request units per second"
+              aria-label="Max request units per second"
               required={true}
               errorMessage={throughputError}
             />

src/Explorer/Controls/ThroughputInput/__snapshots__/ThroughputInput.test.tsx.snap

@@ -654,45 +654,44 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
       <div
         className="ms-Stack css-58"
       >
-        <div
+        <input
+          aria-label="Autoscale database throughput"
+          aria-required={true}
+          checked={true}
+          className="throughputInputRadioBtn"
+          id="Autoscale-input"
           key=".0:$.0"
-          role="radiogroup"
+          onChange={[Function]}
+          role="radio"
+          tabIndex={0}
+          type="radio"
+        />
+        <label
+          className="throughputInputRadioBtnLabel"
+          htmlFor="Autoscale-input"
+          key=".0:$.1"
         >
-          <input
-            aria-label="Autoscale Container throughput (autoscale)"
-            aria-required={true}
-            checked={true}
-            className="throughputInputRadioBtn"
-            id="Autoscale-input"
-            onChange={[Function]}
-            role="radio"
-            tabIndex={0}
-            type="radio"
-          />
-          <label
-            className="throughputInputRadioBtnLabel"
-            htmlFor="Autoscale-input"
-          >
-            Autoscale
-          </label>
-          <input
-            aria-label="Manual Container throughput (autoscale)"
-            aria-required={true}
-            checked={false}
-            className="throughputInputRadioBtn"
-            id="Manual-input"
-            onChange={[Function]}
-            role="radio"
-            tabIndex={0}
-            type="radio"
-          />
-          <label
-            className="throughputInputRadioBtnLabel"
-            htmlFor="Manual-input"
-          >
-            Manual
-          </label>
-        </div>
+          Autoscale
+        </label>
+        <input
+          aria-label="Manual database throughput"
+          aria-required={true}
+          checked={false}
+          className="throughputInputRadioBtn"
+          id="Manual-input"
+          key=".0:$.2"
+          onChange={[Function]}
+          role="radio"
+          tabIndex={0}
+          type="radio"
+        />
+        <label
+          className="throughputInputRadioBtnLabel"
+          htmlFor="Manual-input"
+          key=".0:$.3"
+        >
+          Manual
+        </label>
       </div>
     </Stack>
     <Stack
@@ -712,309 +711,301 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
           >
             Estimate your required RU/s with
              
-            <u
-              style={
-                Object {
-                  "color": "#0078D4",
-                }
-              }
+            <StyledLinkBase
+              aria-label="capacity calculator of azure cosmos db"
+              href="https://cosmos.azure.com/capacitycalculator/"
+              target="_blank"
             >
-              <StyledLinkBase
+              <LinkBase
                 aria-label="capacity calculator of azure cosmos db"
                 href="https://cosmos.azure.com/capacitycalculator/"
+                styles={[Function]}
                 target="_blank"
-              >
-                <LinkBase
-                  aria-label="capacity calculator of azure cosmos db"
-                  href="https://cosmos.azure.com/capacitycalculator/"
-                  styles={[Function]}
-                  target="_blank"
-                  theme={
-                    Object {
-                      "disableGlobalClassNames": false,
-                      "effects": Object {
-                        "elevation16": "0 6.4px 14.4px 0 rgba(0, 0, 0, 0.132), 0 1.2px 3.6px 0 rgba(0, 0, 0, 0.108)",
-                        "elevation4": "0 1.6px 3.6px 0 rgba(0, 0, 0, 0.132), 0 0.3px 0.9px 0 rgba(0, 0, 0, 0.108)",
-                        "elevation64": "0 25.6px 57.6px 0 rgba(0, 0, 0, 0.22), 0 4.8px 14.4px 0 rgba(0, 0, 0, 0.18)",
-                        "elevation8": "0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108)",
-                        "roundedCorner2": "2px",
-                        "roundedCorner4": "4px",
-                        "roundedCorner6": "6px",
+                theme={
+                  Object {
+                    "disableGlobalClassNames": false,
+                    "effects": Object {
+                      "elevation16": "0 6.4px 14.4px 0 rgba(0, 0, 0, 0.132), 0 1.2px 3.6px 0 rgba(0, 0, 0, 0.108)",
+                      "elevation4": "0 1.6px 3.6px 0 rgba(0, 0, 0, 0.132), 0 0.3px 0.9px 0 rgba(0, 0, 0, 0.108)",
+                      "elevation64": "0 25.6px 57.6px 0 rgba(0, 0, 0, 0.22), 0 4.8px 14.4px 0 rgba(0, 0, 0, 0.18)",
+                      "elevation8": "0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108)",
+                      "roundedCorner2": "2px",
+                      "roundedCorner4": "4px",
+                      "roundedCorner6": "6px",
+                    },
+                    "fonts": Object {
+                      "large": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "18px",
+                        "fontWeight": 400,
                       },
-                      "fonts": Object {
-                        "large": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "18px",
-                          "fontWeight": 400,
-                        },
-                        "medium": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "14px",
-                          "fontWeight": 400,
-                        },
-                        "mediumPlus": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "16px",
-                          "fontWeight": 400,
-                        },
-                        "mega": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "68px",
-                          "fontWeight": 600,
-                        },
-                        "small": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "12px",
-                          "fontWeight": 400,
-                        },
-                        "smallPlus": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "12px",
-                          "fontWeight": 400,
-                        },
-                        "superLarge": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "42px",
-                          "fontWeight": 600,
-                        },
-                        "tiny": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "10px",
-                          "fontWeight": 400,
-                        },
-                        "xLarge": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "20px",
-                          "fontWeight": 600,
-                        },
-                        "xLargePlus": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "24px",
-                          "fontWeight": 600,
-                        },
-                        "xSmall": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "10px",
-                          "fontWeight": 400,
-                        },
-                        "xxLarge": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "28px",
-                          "fontWeight": 600,
-                        },
-                        "xxLargePlus": Object {
-                          "MozOsxFontSmoothing": "grayscale",
-                          "WebkitFontSmoothing": "antialiased",
-                          "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
-                          "fontSize": "32px",
-                          "fontWeight": 600,
-                        },
+                      "medium": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "14px",
+                        "fontWeight": 400,
                       },
-                      "isInverted": false,
-                      "palette": Object {
-                        "accent": "#0078d4",
-                        "black": "#000000",
-                        "blackTranslucent40": "rgba(0,0,0,.4)",
-                        "blue": "#0078d4",
-                        "blueDark": "#002050",
-                        "blueLight": "#00bcf2",
-                        "blueMid": "#00188f",
-                        "green": "#107c10",
-                        "greenDark": "#004b1c",
-                        "greenLight": "#bad80a",
-                        "magenta": "#b4009e",
-                        "magentaDark": "#5c005c",
-                        "magentaLight": "#e3008c",
-                        "neutralDark": "#201f1e",
-                        "neutralLight": "#edebe9",
-                        "neutralLighter": "#f3f2f1",
-                        "neutralLighterAlt": "#faf9f8",
-                        "neutralPrimary": "#323130",
-                        "neutralPrimaryAlt": "#3b3a39",
-                        "neutralQuaternary": "#d2d0ce",
-                        "neutralQuaternaryAlt": "#e1dfdd",
-                        "neutralSecondary": "#605e5c",
-                        "neutralSecondaryAlt": "#8a8886",
-                        "neutralTertiary": "#a19f9d",
-                        "neutralTertiaryAlt": "#c8c6c4",
-                        "orange": "#d83b01",
-                        "orangeLight": "#ea4300",
-                        "orangeLighter": "#ff8c00",
-                        "purple": "#5c2d91",
-                        "purpleDark": "#32145a",
-                        "purpleLight": "#b4a0ff",
-                        "red": "#e81123",
-                        "redDark": "#a4262c",
-                        "teal": "#008272",
-                        "tealDark": "#004b50",
-                        "tealLight": "#00b294",
-                        "themeDark": "#005a9e",
-                        "themeDarkAlt": "#106ebe",
-                        "themeDarker": "#004578",
-                        "themeLight": "#c7e0f4",
-                        "themeLighter": "#deecf9",
-                        "themeLighterAlt": "#eff6fc",
-                        "themePrimary": "#0078d4",
-                        "themeSecondary": "#2b88d8",
-                        "themeTertiary": "#71afe5",
-                        "white": "#ffffff",
-                        "whiteTranslucent40": "rgba(255,255,255,.4)",
-                        "yellow": "#ffb900",
-                        "yellowDark": "#d29200",
-                        "yellowLight": "#fff100",
+                      "mediumPlus": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "16px",
+                        "fontWeight": 400,
                       },
-                      "rtl": undefined,
-                      "semanticColors": Object {
-                        "accentButtonBackground": "#0078d4",
-                        "accentButtonText": "#ffffff",
-                        "actionLink": "#323130",
-                        "actionLinkHovered": "#201f1e",
-                        "blockingBackground": "#FDE7E9",
-                        "blockingIcon": "#FDE7E9",
-                        "bodyBackground": "#ffffff",
-                        "bodyBackgroundChecked": "#edebe9",
-                        "bodyBackgroundHovered": "#f3f2f1",
-                        "bodyDivider": "#edebe9",
-                        "bodyFrameBackground": "#ffffff",
-                        "bodyFrameDivider": "#edebe9",
-                        "bodyStandoutBackground": "#faf9f8",
-                        "bodySubtext": "#605e5c",
-                        "bodyText": "#323130",
-                        "bodyTextChecked": "#000000",
-                        "buttonBackground": "#ffffff",
-                        "buttonBackgroundChecked": "#c8c6c4",
-                        "buttonBackgroundCheckedHovered": "#edebe9",
-                        "buttonBackgroundDisabled": "#f3f2f1",
-                        "buttonBackgroundHovered": "#f3f2f1",
-                        "buttonBackgroundPressed": "#edebe9",
-                        "buttonBorder": "#8a8886",
-                        "buttonBorderDisabled": "#f3f2f1",
-                        "buttonText": "#323130",
-                        "buttonTextChecked": "#201f1e",
-                        "buttonTextCheckedHovered": "#000000",
-                        "buttonTextDisabled": "#a19f9d",
-                        "buttonTextHovered": "#201f1e",
-                        "buttonTextPressed": "#201f1e",
-                        "cardShadow": "0 1.6px 3.6px 0 rgba(0, 0, 0, 0.132), 0 0.3px 0.9px 0 rgba(0, 0, 0, 0.108)",
-                        "cardShadowHovered": "0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108)",
-                        "cardStandoutBackground": "#ffffff",
-                        "defaultStateBackground": "#faf9f8",
-                        "disabledBackground": "#f3f2f1",
-                        "disabledBodySubtext": "#c8c6c4",
-                        "disabledBodyText": "#a19f9d",
-                        "disabledBorder": "#c8c6c4",
-                        "disabledSubtext": "#d2d0ce",
-                        "disabledText": "#a19f9d",
-                        "errorBackground": "#FDE7E9",
-                        "errorIcon": "#A80000",
-                        "errorText": "#a4262c",
-                        "focusBorder": "#605e5c",
-                        "infoBackground": "#f3f2f1",
-                        "infoIcon": "#605e5c",
-                        "inputBackground": "#ffffff",
-                        "inputBackgroundChecked": "#0078d4",
-                        "inputBackgroundCheckedHovered": "#005a9e",
-                        "inputBorder": "#605e5c",
-                        "inputBorderHovered": "#323130",
-                        "inputFocusBorderAlt": "#0078d4",
-                        "inputForegroundChecked": "#ffffff",
-                        "inputIcon": "#0078d4",
-                        "inputIconDisabled": "#a19f9d",
-                        "inputIconHovered": "#005a9e",
-                        "inputPlaceholderBackgroundChecked": "#deecf9",
-                        "inputPlaceholderText": "#605e5c",
-                        "inputText": "#323130",
-                        "inputTextHovered": "#201f1e",
-                        "link": "#0078d4",
-                        "linkHovered": "#004578",
-                        "listBackground": "#ffffff",
-                        "listHeaderBackgroundHovered": "#f3f2f1",
-                        "listHeaderBackgroundPressed": "#edebe9",
-                        "listItemBackgroundChecked": "#edebe9",
-                        "listItemBackgroundCheckedHovered": "#e1dfdd",
-                        "listItemBackgroundHovered": "#f3f2f1",
-                        "listText": "#323130",
-                        "listTextColor": "#323130",
-                        "menuBackground": "#ffffff",
-                        "menuDivider": "#c8c6c4",
-                        "menuHeader": "#0078d4",
-                        "menuIcon": "#0078d4",
-                        "menuItemBackgroundChecked": "#edebe9",
-                        "menuItemBackgroundHovered": "#f3f2f1",
-                        "menuItemBackgroundPressed": "#edebe9",
-                        "menuItemText": "#323130",
-                        "menuItemTextHovered": "#201f1e",
-                        "messageLink": "#005A9E",
-                        "messageLinkHovered": "#004578",
-                        "messageText": "#323130",
-                        "primaryButtonBackground": "#0078d4",
-                        "primaryButtonBackgroundDisabled": "#f3f2f1",
-                        "primaryButtonBackgroundHovered": "#106ebe",
-                        "primaryButtonBackgroundPressed": "#005a9e",
-                        "primaryButtonBorder": "transparent",
-                        "primaryButtonText": "#ffffff",
-                        "primaryButtonTextDisabled": "#d2d0ce",
-                        "primaryButtonTextHovered": "#ffffff",
-                        "primaryButtonTextPressed": "#ffffff",
-                        "severeWarningBackground": "#FED9CC",
-                        "severeWarningIcon": "#D83B01",
-                        "smallInputBorder": "#605e5c",
-                        "successBackground": "#DFF6DD",
-                        "successIcon": "#107C10",
-                        "successText": "#107C10",
-                        "variantBorder": "#edebe9",
-                        "variantBorderHovered": "#a19f9d",
-                        "warningBackground": "#FFF4CE",
-                        "warningHighlight": "#ffb900",
-                        "warningIcon": "#797775",
-                        "warningText": "#323130",
+                      "mega": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "68px",
+                        "fontWeight": 600,
                       },
-                      "spacing": Object {
-                        "l1": "20px",
-                        "l2": "32px",
-                        "m": "16px",
-                        "s1": "8px",
-                        "s2": "4px",
+                      "small": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "12px",
+                        "fontWeight": 400,
                       },
-                    }
+                      "smallPlus": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "12px",
+                        "fontWeight": 400,
+                      },
+                      "superLarge": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "42px",
+                        "fontWeight": 600,
+                      },
+                      "tiny": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "10px",
+                        "fontWeight": 400,
+                      },
+                      "xLarge": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "20px",
+                        "fontWeight": 600,
+                      },
+                      "xLargePlus": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "24px",
+                        "fontWeight": 600,
+                      },
+                      "xSmall": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "10px",
+                        "fontWeight": 400,
+                      },
+                      "xxLarge": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "28px",
+                        "fontWeight": 600,
+                      },
+                      "xxLargePlus": Object {
+                        "MozOsxFontSmoothing": "grayscale",
+                        "WebkitFontSmoothing": "antialiased",
+                        "fontFamily": "'Segoe UI', 'Segoe UI Web (West European)', 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif",
+                        "fontSize": "32px",
+                        "fontWeight": 600,
+                      },
+                    },
+                    "isInverted": false,
+                    "palette": Object {
+                      "accent": "#0078d4",
+                      "black": "#000000",
+                      "blackTranslucent40": "rgba(0,0,0,.4)",
+                      "blue": "#0078d4",
+                      "blueDark": "#002050",
+                      "blueLight": "#00bcf2",
+                      "blueMid": "#00188f",
+                      "green": "#107c10",
+                      "greenDark": "#004b1c",
+                      "greenLight": "#bad80a",
+                      "magenta": "#b4009e",
+                      "magentaDark": "#5c005c",
+                      "magentaLight": "#e3008c",
+                      "neutralDark": "#201f1e",
+                      "neutralLight": "#edebe9",
+                      "neutralLighter": "#f3f2f1",
+                      "neutralLighterAlt": "#faf9f8",
+                      "neutralPrimary": "#323130",
+                      "neutralPrimaryAlt": "#3b3a39",
+                      "neutralQuaternary": "#d2d0ce",
+                      "neutralQuaternaryAlt": "#e1dfdd",
+                      "neutralSecondary": "#605e5c",
+                      "neutralSecondaryAlt": "#8a8886",
+                      "neutralTertiary": "#a19f9d",
+                      "neutralTertiaryAlt": "#c8c6c4",
+                      "orange": "#d83b01",
+                      "orangeLight": "#ea4300",
+                      "orangeLighter": "#ff8c00",
+                      "purple": "#5c2d91",
+                      "purpleDark": "#32145a",
+                      "purpleLight": "#b4a0ff",
+                      "red": "#e81123",
+                      "redDark": "#a4262c",
+                      "teal": "#008272",
+                      "tealDark": "#004b50",
+                      "tealLight": "#00b294",
+                      "themeDark": "#005a9e",
+                      "themeDarkAlt": "#106ebe",
+                      "themeDarker": "#004578",
+                      "themeLight": "#c7e0f4",
+                      "themeLighter": "#deecf9",
+                      "themeLighterAlt": "#eff6fc",
+                      "themePrimary": "#0078d4",
+                      "themeSecondary": "#2b88d8",
+                      "themeTertiary": "#71afe5",
+                      "white": "#ffffff",
+                      "whiteTranslucent40": "rgba(255,255,255,.4)",
+                      "yellow": "#ffb900",
+                      "yellowDark": "#d29200",
+                      "yellowLight": "#fff100",
+                    },
+                    "rtl": undefined,
+                    "semanticColors": Object {
+                      "accentButtonBackground": "#0078d4",
+                      "accentButtonText": "#ffffff",
+                      "actionLink": "#323130",
+                      "actionLinkHovered": "#201f1e",
+                      "blockingBackground": "#FDE7E9",
+                      "blockingIcon": "#FDE7E9",
+                      "bodyBackground": "#ffffff",
+                      "bodyBackgroundChecked": "#edebe9",
+                      "bodyBackgroundHovered": "#f3f2f1",
+                      "bodyDivider": "#edebe9",
+                      "bodyFrameBackground": "#ffffff",
+                      "bodyFrameDivider": "#edebe9",
+                      "bodyStandoutBackground": "#faf9f8",
+                      "bodySubtext": "#605e5c",
+                      "bodyText": "#323130",
+                      "bodyTextChecked": "#000000",
+                      "buttonBackground": "#ffffff",
+                      "buttonBackgroundChecked": "#c8c6c4",
+                      "buttonBackgroundCheckedHovered": "#edebe9",
+                      "buttonBackgroundDisabled": "#f3f2f1",
+                      "buttonBackgroundHovered": "#f3f2f1",
+                      "buttonBackgroundPressed": "#edebe9",
+                      "buttonBorder": "#8a8886",
+                      "buttonBorderDisabled": "#f3f2f1",
+                      "buttonText": "#323130",
+                      "buttonTextChecked": "#201f1e",
+                      "buttonTextCheckedHovered": "#000000",
+                      "buttonTextDisabled": "#a19f9d",
+                      "buttonTextHovered": "#201f1e",
+                      "buttonTextPressed": "#201f1e",
+                      "cardShadow": "0 1.6px 3.6px 0 rgba(0, 0, 0, 0.132), 0 0.3px 0.9px 0 rgba(0, 0, 0, 0.108)",
+                      "cardShadowHovered": "0 3.2px 7.2px 0 rgba(0, 0, 0, 0.132), 0 0.6px 1.8px 0 rgba(0, 0, 0, 0.108)",
+                      "cardStandoutBackground": "#ffffff",
+                      "defaultStateBackground": "#faf9f8",
+                      "disabledBackground": "#f3f2f1",
+                      "disabledBodySubtext": "#c8c6c4",
+                      "disabledBodyText": "#a19f9d",
+                      "disabledBorder": "#c8c6c4",
+                      "disabledSubtext": "#d2d0ce",
+                      "disabledText": "#a19f9d",
+                      "errorBackground": "#FDE7E9",
+                      "errorIcon": "#A80000",
+                      "errorText": "#a4262c",
+                      "focusBorder": "#605e5c",
+                      "infoBackground": "#f3f2f1",
+                      "infoIcon": "#605e5c",
+                      "inputBackground": "#ffffff",
+                      "inputBackgroundChecked": "#0078d4",
+                      "inputBackgroundCheckedHovered": "#005a9e",
+                      "inputBorder": "#605e5c",
+                      "inputBorderHovered": "#323130",
+                      "inputFocusBorderAlt": "#0078d4",
+                      "inputForegroundChecked": "#ffffff",
+                      "inputIcon": "#0078d4",
+                      "inputIconDisabled": "#a19f9d",
+                      "inputIconHovered": "#005a9e",
+                      "inputPlaceholderBackgroundChecked": "#deecf9",
+                      "inputPlaceholderText": "#605e5c",
+                      "inputText": "#323130",
+                      "inputTextHovered": "#201f1e",
+                      "link": "#0078d4",
+                      "linkHovered": "#004578",
+                      "listBackground": "#ffffff",
+                      "listHeaderBackgroundHovered": "#f3f2f1",
+                      "listHeaderBackgroundPressed": "#edebe9",
+                      "listItemBackgroundChecked": "#edebe9",
+                      "listItemBackgroundCheckedHovered": "#e1dfdd",
+                      "listItemBackgroundHovered": "#f3f2f1",
+                      "listText": "#323130",
+                      "listTextColor": "#323130",
+                      "menuBackground": "#ffffff",
+                      "menuDivider": "#c8c6c4",
+                      "menuHeader": "#0078d4",
+                      "menuIcon": "#0078d4",
+                      "menuItemBackgroundChecked": "#edebe9",
+                      "menuItemBackgroundHovered": "#f3f2f1",
+                      "menuItemBackgroundPressed": "#edebe9",
+                      "menuItemText": "#323130",
+                      "menuItemTextHovered": "#201f1e",
+                      "messageLink": "#005A9E",
+                      "messageLinkHovered": "#004578",
+                      "messageText": "#323130",
+                      "primaryButtonBackground": "#0078d4",
+                      "primaryButtonBackgroundDisabled": "#f3f2f1",
+                      "primaryButtonBackgroundHovered": "#106ebe",
+                      "primaryButtonBackgroundPressed": "#005a9e",
+                      "primaryButtonBorder": "transparent",
+                      "primaryButtonText": "#ffffff",
+                      "primaryButtonTextDisabled": "#d2d0ce",
+                      "primaryButtonTextHovered": "#ffffff",
+                      "primaryButtonTextPressed": "#ffffff",
+                      "severeWarningBackground": "#FED9CC",
+                      "severeWarningIcon": "#D83B01",
+                      "smallInputBorder": "#605e5c",
+                      "successBackground": "#DFF6DD",
+                      "successIcon": "#107C10",
+                      "successText": "#107C10",
+                      "variantBorder": "#edebe9",
+                      "variantBorderHovered": "#a19f9d",
+                      "warningBackground": "#FFF4CE",
+                      "warningHighlight": "#ffb900",
+                      "warningIcon": "#797775",
+                      "warningText": "#323130",
+                    },
+                    "spacing": Object {
+                      "l1": "20px",
+                      "l2": "32px",
+                      "m": "16px",
+                      "s1": "8px",
+                      "s2": "4px",
+                    },
                   }
+                }
+              >
+                <a
+                  aria-label="capacity calculator of azure cosmos db"
+                  className="ms-Link root-60"
+                  href="https://cosmos.azure.com/capacitycalculator/"
+                  onClick={[Function]}
+                  target="_blank"
                 >
-                  <a
-                    aria-label="capacity calculator of azure cosmos db"
-                    className="ms-Link root-60"
-                    href="https://cosmos.azure.com/capacitycalculator/"
-                    onClick={[Function]}
-                    target="_blank"
-                  >
-                    capacity calculator
-                  </a>
-                </LinkBase>
-              </StyledLinkBase>
-            </u>
+                  capacity calculator
+                </a>
+              </LinkBase>
+            </StyledLinkBase>
             .
           </span>
         </Text>
@@ -1648,11 +1639,10 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
           </div>
         </Stack>
         <StyledTextFieldBase
-          ariaLabel="Max request units per second"
+          aria-label="Max request units per second"
           errorMessage=""
           id="autoscaleRUValueField"
           key=".0:$.2"
-          max={9000000000000}
           min={1000}
           onChange={[Function]}
           required={true}
@@ -1672,11 +1662,10 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
           value="4000"
         >
           <TextFieldBase
-            ariaLabel="Max request units per second"
+            aria-label="Max request units per second"
             deferredValidationTime={200}
             errorMessage=""
             id="autoscaleRUValueField"
-            max={9000000000000}
             min={1000}
             onChange={[Function]}
             required={true}
@@ -1971,10 +1960,8 @@ exports[`ThroughputInput Pane should render Default properly 1`] = `
                 >
                   <input
                     aria-invalid={false}
-                    aria-label="Max request units per second"
                     className="ms-TextField-field field-64"
                     id="autoscaleRUValueField"
-                    max={9000000000000}
                     min={1000}
                     onBlur={[Function]}
                     onChange={[Function]}

src/Explorer/Controls/TreeComponent/TreeComponent.tsx

@@ -195,7 +195,7 @@ export class TreeNodeComponent extends React.Component<TreeNodeComponentProps, T
         </div>
         {node.children && (
           <AnimateHeight duration={TreeNodeComponent.transitionDurationMS} height={this.state.isExpanded ? "auto" : 0}>
-            <div className="nodeChildren" data-test={node.label} role="group">
+            <div className="nodeChildren" data-test={node.label}>
               {TreeNodeComponent.getSortedChildren(node).map((childNode: TreeNode) => (
                 <TreeNodeComponent
                   key={`${childNode.label}-${generation + 1}-${childNode.timestamp}`}

src/Explorer/Controls/TreeComponent/__snapshots__/TreeComponent.test.tsx.snap

@@ -100,7 +100,6 @@ exports[`TreeNodeComponent does not render children by default 1`] = `
     <div
       className="nodeChildren"
       data-test="label"
-      role="group"
     >
       <TreeNodeComponent
         generation={3}
@@ -252,7 +251,6 @@ exports[`TreeNodeComponent renders a simple node (sorted children, expanded) 1`]
     <div
       className="nodeChildren"
       data-test="label"
-      role="group"
     >
       <TreeNodeComponent
         generation={13}
@@ -354,7 +352,6 @@ exports[`TreeNodeComponent renders loading icon 1`] = `
     <div
       className="nodeChildren"
       data-test="label"
-      role="group"
     />
   </AnimateHeight>
 </div>
@@ -468,7 +465,6 @@ exports[`TreeNodeComponent renders sorted children, expanded, leaves and parents
     <div
       className="nodeChildren"
       data-test="label"
-      role="group"
     >
       <TreeNodeComponent
         generation={13}
@@ -598,7 +594,6 @@ exports[`TreeNodeComponent renders unsorted children by default 1`] = `
     <div
       className="nodeChildren"
       data-test="label"
-      role="group"
     >
       <TreeNodeComponent
         generation={3}

src/Explorer/Controls/TreeComponent/treeComponent.less

@@ -3,11 +3,11 @@
 .treeComponent {
   .nodeItem {
     &:focus {
-      outline: 2px @AccentMedium;
+      outline: 1px dashed @AccentMedium;
     }
 
     .treeNodeHeader {
-      margin: 1px;
+      padding: @SmallSpace 2px;
       cursor: pointer;
       display: flex;
 

src/Explorer/Graph/GraphExplorerComponent/GraphVizComponent.tsx

@@ -40,7 +40,6 @@ export class GraphVizComponent extends React.Component<GraphVizComponentProps> {
             {/* svg load more icon inlined as-is here: remove the style="fill:#374649;" so we can override it */}
             <svg
               role="img"
-              aria-label="graph"
               version="1.1"
               xmlns="http://www.w3.org/2000/svg"
               xmlnsXlink="http://www.w3.org/1999/xlink"
@@ -136,7 +135,6 @@ export class GraphVizComponent extends React.Component<GraphVizComponentProps> {
           <g id="triangleRight">
             <svg
               role="img"
-              aria-label="graph"
               version="1.1"
               id="Layer_1"
               xmlns="http://www.w3.org/2000/svg"

src/Explorer/Graph/GraphExplorerComponent/MiddlePaneComponent.tsx

@@ -17,19 +17,19 @@ export class MiddlePaneComponent extends React.Component<MiddlePaneComponentProp
       <div className="middlePane">
         <div className="graphTitle">
           <span className="paneTitle">Graph</span>
-          <button
-            style={{ border: "none", background: "none" }}
+          <span
             className="graphExpandCollapseBtn pull-right"
             onClick={this.props.toggleExpandGraph}
             role="button"
             aria-expanded={this.props.isTabsContentExpanded}
-            aria-label="View graph in full screen"
+            aria-name="View graph in full screen"
+            tabIndex={0}
           >
             <img
               src={this.props.isTabsContentExpanded ? CollapseArrowIcon : ExpandIcon}
               alt={this.props.isTabsContentExpanded ? "collapse graph content" : "expand graph content"}
             />
-          </button>
+          </span>
         </div>
         <div className="maingraphContainer">
           <GraphVizComponent forceGraphParams={this.props.graphVizProps.forceGraphParams} />

src/Explorer/Menus/CommandBar/CommandBarComponentButtonFactory.tsx

@@ -202,7 +202,6 @@ export function createControlCommandBarButtons(container: Explorer): CommandButt
   if (showOpenFullScreen) {
     const label = "Open Full Screen";
     const fullScreenButton: CommandButtonComponentProps = {
-      id: "openFullScreenBtn",
       iconSrc: OpenInTabIcon,
       iconAlt: label,
       onCommandClick: () => {

src/Explorer/Menus/NotificationConsole/NotificationConsoleComponent.tsx

@@ -147,9 +147,12 @@ export class NotificationConsoleComponent extends React.Component<
             <div className="notificationConsoleControls">
               <Dropdown
                 label="Filter:"
+                role="combobox"
                 selectedKey={this.state.selectedFilter}
                 options={NotificationConsoleComponent.FilterOptions}
                 onChange={this.onFilterSelected.bind(this)}
+                aria-labelledby="consoleFilterLabel"
+                aria-label={this.state.selectedFilter}
               />
               <span className="consoleSplitter" />
               <span

src/Explorer/Menus/NotificationConsole/__snapshots__/NotificationConsoleComponent.test.tsx.snap

@@ -112,6 +112,8 @@ exports[`NotificationConsoleComponent renders the console 1`] = `
         className="notificationConsoleControls"
       >
         <Dropdown
+          aria-label="All"
+          aria-labelledby="consoleFilterLabel"
           label="Filter:"
           onChange={[Function]}
           options={
@@ -134,6 +136,7 @@ exports[`NotificationConsoleComponent renders the console 1`] = `
               },
             ]
           }
+          role="combobox"
           selectedKey="All"
         />
         <span
@@ -275,6 +278,8 @@ exports[`NotificationConsoleComponent renders the console 2`] = `
         className="notificationConsoleControls"
       >
         <Dropdown
+          aria-label="All"
+          aria-labelledby="consoleFilterLabel"
           label="Filter:"
           onChange={[Function]}
           options={
@@ -297,6 +302,7 @@ exports[`NotificationConsoleComponent renders the console 2`] = `
               },
             ]
           }
+          role="combobox"
           selectedKey="All"
         />
         <span

src/Explorer/Notebook/NotebookComponent/InMemoryContentProviderUtils.test.ts

@@ -1,23 +0,0 @@
-import * as InMemoryContentProviderUtils from "./ContentProviders/InMemoryContentProviderUtils";
-
-describe("fromContentUri", () => {
-  it("fromContentUri should return valid result", () => {
-    const contentUri = "memory://resource/path";
-    const result = "resource";
-
-    expect(InMemoryContentProviderUtils.fromContentUri(contentUri)).toEqual(result);
-  });
-
-  it("fromContentUri should return undefined on invalid input", () => {
-    const contentUri = "invalid";
-
-    expect(InMemoryContentProviderUtils.fromContentUri(contentUri)).toEqual(undefined);
-  });
-
-  it("toContentUri should return valid result", () => {
-    const path = "resource/path";
-    const result = "memory://resource/path";
-
-    expect(InMemoryContentProviderUtils.toContentUri(path)).toEqual(result);
-  });
-});

src/Explorer/Panes/AddCollectionPanel.tsx

@@ -274,34 +274,32 @@ export class AddCollectionPanel extends React.Component<AddCollectionPanelProps,
             </Stack>
 
             <Stack horizontal verticalAlign="center">
-              <div role="radiogroup">
-                <input
-                  className="panelRadioBtn"
-                  checked={this.state.createNewDatabase}
-                  aria-label="Create new database"
-                  aria-checked={this.state.createNewDatabase}
-                  name="databaseType"
-                  type="radio"
-                  role="radio"
-                  id="databaseCreateNew"
-                  tabIndex={0}
-                  onChange={this.onCreateNewDatabaseRadioBtnChange.bind(this)}
-                />
-                <span className="panelRadioBtnLabel">Create new</span>
+              <input
+                className="panelRadioBtn"
+                checked={this.state.createNewDatabase}
+                aria-label="Create new database"
+                aria-checked={this.state.createNewDatabase}
+                name="databaseType"
+                type="radio"
+                role="radio"
+                id="databaseCreateNew"
+                tabIndex={0}
+                onChange={this.onCreateNewDatabaseRadioBtnChange.bind(this)}
+              />
+              <span className="panelRadioBtnLabel">Create new</span>
 
-                <input
-                  className="panelRadioBtn"
-                  checked={!this.state.createNewDatabase}
-                  aria-label="Use existing database"
-                  aria-checked={!this.state.createNewDatabase}
-                  name="databaseType"
-                  type="radio"
-                  role="radio"
-                  tabIndex={0}
-                  onChange={this.onUseExistingDatabaseRadioBtnChange.bind(this)}
-                />
-                <span className="panelRadioBtnLabel">Use existing</span>
-              </div>
+              <input
+                className="panelRadioBtn"
+                checked={!this.state.createNewDatabase}
+                aria-label="Use existing database"
+                aria-checked={!this.state.createNewDatabase}
+                name="databaseType"
+                type="radio"
+                role="radio"
+                tabIndex={0}
+                onChange={this.onUseExistingDatabaseRadioBtnChange.bind(this)}
+              />
+              <span className="panelRadioBtnLabel">Use existing</span>
             </Stack>
 
             {this.state.createNewDatabase && (
@@ -403,7 +401,6 @@ export class AddCollectionPanel extends React.Component<AddCollectionPanelProps,
                 content={`Unique identifier for the ${getCollectionName().toLocaleLowerCase()} and used for id-based routing through REST and all SDKs.`}
               >
                 <Icon
-                  role="button"
                   iconName="Info"
                   className="panelInfoIcon"
                   tabIndex={0}
@@ -805,37 +802,35 @@ export class AddCollectionPanel extends React.Component<AddCollectionPanelProps,
               </Stack>
 
               <Stack horizontal verticalAlign="center">
-                <div role="radiogroup">
-                  <input
-                    className="panelRadioBtn"
-                    checked={this.state.enableAnalyticalStore}
-                    disabled={!this.isSynapseLinkEnabled()}
-                    aria-label="Enable analytical store"
-                    aria-checked={this.state.enableAnalyticalStore}
-                    name="analyticalStore"
-                    type="radio"
-                    role="radio"
-                    id="enableAnalyticalStoreBtn"
-                    tabIndex={0}
-                    onChange={this.onEnableAnalyticalStoreRadioBtnChange.bind(this)}
-                  />
-                  <span className="panelRadioBtnLabel">On</span>
+                <input
+                  className="panelRadioBtn"
+                  checked={this.state.enableAnalyticalStore}
+                  disabled={!this.isSynapseLinkEnabled()}
+                  aria-label="Enable analytical store"
+                  aria-checked={this.state.enableAnalyticalStore}
+                  name="analyticalStore"
+                  type="radio"
+                  role="radio"
+                  id="enableAnalyticalStoreBtn"
+                  tabIndex={0}
+                  onChange={this.onEnableAnalyticalStoreRadioBtnChange.bind(this)}
+                />
+                <span className="panelRadioBtnLabel">On</span>
 
-                  <input
-                    className="panelRadioBtn"
-                    checked={!this.state.enableAnalyticalStore}
-                    disabled={!this.isSynapseLinkEnabled()}
-                    aria-label="Disable analytical store"
-                    aria-checked={!this.state.enableAnalyticalStore}
-                    name="analyticalStore"
-                    type="radio"
-                    role="radio"
-                    id="disableAnalyticalStoreBtn"
-                    tabIndex={0}
-                    onChange={this.onDisableAnalyticalStoreRadioBtnChange.bind(this)}
-                  />
-                  <span className="panelRadioBtnLabel">Off</span>
-                </div>
+                <input
+                  className="panelRadioBtn"
+                  checked={!this.state.enableAnalyticalStore}
+                  disabled={!this.isSynapseLinkEnabled()}
+                  aria-label="Disable analytical store"
+                  aria-checked={!this.state.enableAnalyticalStore}
+                  name="analyticalStore"
+                  type="radio"
+                  role="radio"
+                  id="disableAnalyticalStoreBtn"
+                  tabIndex={0}
+                  onChange={this.onDisableAnalyticalStoreRadioBtnChange.bind(this)}
+                />
+                <span className="panelRadioBtnLabel">Off</span>
               </Stack>
 
               {!this.isSynapseLinkEnabled() && (

src/Explorer/Panes/__snapshots__/AddCollectionPanel.test.tsx.snap

@@ -42,43 +42,39 @@ exports[`AddCollectionPanel should render Default properly 1`] = `
         horizontal={true}
         verticalAlign="center"
       >
-        <div
-          role="radiogroup"
+        <input
+          aria-checked={true}
+          aria-label="Create new database"
+          checked={true}
+          className="panelRadioBtn"
+          id="databaseCreateNew"
+          name="databaseType"
+          onChange={[Function]}
+          role="radio"
+          tabIndex={0}
+          type="radio"
+        />
+        <span
+          className="panelRadioBtnLabel"
         >
-          <input
-            aria-checked={true}
-            aria-label="Create new database"
-            checked={true}
-            className="panelRadioBtn"
-            id="databaseCreateNew"
-            name="databaseType"
-            onChange={[Function]}
-            role="radio"
-            tabIndex={0}
-            type="radio"
-          />
-          <span
-            className="panelRadioBtnLabel"
-          >
-            Create new
-          </span>
-          <input
-            aria-checked={false}
-            aria-label="Use existing database"
-            checked={false}
-            className="panelRadioBtn"
-            name="databaseType"
-            onChange={[Function]}
-            role="radio"
-            tabIndex={0}
-            type="radio"
-          />
-          <span
-            className="panelRadioBtnLabel"
-          >
-            Use existing
-          </span>
-        </div>
+          Create new
+        </span>
+        <input
+          aria-checked={false}
+          aria-label="Use existing database"
+          checked={false}
+          className="panelRadioBtn"
+          name="databaseType"
+          onChange={[Function]}
+          role="radio"
+          tabIndex={0}
+          type="radio"
+        />
+        <span
+          className="panelRadioBtnLabel"
+        >
+          Use existing
+        </span>
       </Stack>
       <Stack
         className="panelGroupSpacing"
@@ -172,7 +168,6 @@ exports[`AddCollectionPanel should render Default properly 1`] = `
             ariaLabel="Unique identifier for the container and used for id-based routing through REST and all SDKs."
             className="panelInfoIcon"
             iconName="Info"
-            role="button"
             tabIndex={0}
           />
         </StyledTooltipHostBase>
@@ -347,46 +342,42 @@ exports[`AddCollectionPanel should render Default properly 1`] = `
         horizontal={true}
         verticalAlign="center"
       >
-        <div
-          role="radiogroup"
+        <input
+          aria-checked={false}
+          aria-label="Enable analytical store"
+          checked={false}
+          className="panelRadioBtn"
+          disabled={true}
+          id="enableAnalyticalStoreBtn"
+          name="analyticalStore"
+          onChange={[Function]}
+          role="radio"
+          tabIndex={0}
+          type="radio"
+        />
+        <span
+          className="panelRadioBtnLabel"
         >
-          <input
-            aria-checked={false}
-            aria-label="Enable analytical store"
-            checked={false}
-            className="panelRadioBtn"
-            disabled={true}
-            id="enableAnalyticalStoreBtn"
-            name="analyticalStore"
-            onChange={[Function]}
-            role="radio"
-            tabIndex={0}
-            type="radio"
-          />
-          <span
-            className="panelRadioBtnLabel"
-          >
-            On
-          </span>
-          <input
-            aria-checked={true}
-            aria-label="Disable analytical store"
-            checked={true}
-            className="panelRadioBtn"
-            disabled={true}
-            id="disableAnalyticalStoreBtn"
-            name="analyticalStore"
-            onChange={[Function]}
-            role="radio"
-            tabIndex={0}
-            type="radio"
-          />
-          <span
-            className="panelRadioBtnLabel"
-          >
-            Off
-          </span>
-        </div>
+          On
+        </span>
+        <input
+          aria-checked={true}
+          aria-label="Disable analytical store"
+          checked={true}
+          className="panelRadioBtn"
+          disabled={true}
+          id="disableAnalyticalStoreBtn"
+          name="analyticalStore"
+          onChange={[Function]}
+          role="radio"
+          tabIndex={0}
+          type="radio"
+        />
+        <span
+          className="panelRadioBtnLabel"
+        >
+          Off
+        </span>
       </Stack>
       <Stack
         className="panelGroupSpacing"

src/Explorer/Quickstart/Tutorials/MongoQuickstartTutorial.tsx

@@ -1,4 +1,4 @@
-import { DirectionalHint, Link, Stack, TeachingBubble, Text } from "@fluentui/react";
+import { Link, Stack, TeachingBubble, Text } from "@fluentui/react";
 import { ReactTabKind, useTabs } from "hooks/useTabs";
 import { useTeachingBubble } from "hooks/useTeachingBubble";
 import React from "react";
@@ -18,11 +18,6 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
     return <></>;
   }
 
-  let totalSteps = 9;
-  if (userContext.isTryCosmosDBSubscription) {
-    totalSteps = 10;
-  }
-
   switch (step) {
     case 1:
       return isSampleDBExpanded ? (
@@ -38,7 +33,7 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
             },
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 1 of " + totalSteps}
+          footerContent="Step 1 of 8"
         >
           Start viewing and working with your data by opening Documents under Data
         </TeachingBubble>
@@ -60,7 +55,7 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(1),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 2 of " + totalSteps}
+          footerContent="Step 2 of 8"
         >
           View documents here using the documents window. You can also use your favorite MongoDB tools and drivers to do
           so.
@@ -83,7 +78,7 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(2),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 3 of " + totalSteps}
+          footerContent="Step 3 of 8"
         >
           Add new document by copy / pasting JSON or uploading a JSON. You can also use your favorite MongoDB tools and
           drivers to do so.
@@ -104,7 +99,7 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(3),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 4 of " + totalSteps}
+          footerContent="Step 4 of 8"
         >
           Query your data using the filter function. Azure Cosmos DB for MongoDB provides comprehensive support for
           MongoDB query language constructs. You can also use your favorite MongoDB tools and drivers to do so.
@@ -125,7 +120,7 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(4),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 5 of " + totalSteps}
+          footerContent="Step 5 of 8"
         >
           Change throughput provisioned to your collection according to your needs
         </TeachingBubble>
@@ -145,7 +140,7 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(5),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 6 of " + totalSteps}
+          footerContent="Step 6 of 8"
         >
           Use the indexing policy editor to create and edit your indexes.
         </TeachingBubble>
@@ -165,54 +160,12 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(6),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 7 of " + totalSteps}
+          footerContent="Step 7 of 8"
         >
           Visualize your data, store queries in an interactive document
         </TeachingBubble>
       );
     case 8:
-      return (
-        <TeachingBubble
-          headline="Launch full screen"
-          target={"#openFullScreenBtn"}
-          hasCloseButton
-          primaryButtonProps={{
-            text: "Next",
-            onClick: () => (userContext.isTryCosmosDBSubscription ? setStep(9) : setStep(10)),
-          }}
-          secondaryButtonProps={{
-            text: "Previous",
-            onClick: () => setStep(7),
-          }}
-          onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 8 of " + totalSteps}
-        >
-          This will open a new tab in your browser to use Cosmos DB Explorer. Using the provided URLs you can share
-          read-write or read-only access with other people.
-        </TeachingBubble>
-      );
-    case 9:
-      return (
-        <TeachingBubble
-          headline="Boost your experience"
-          target={"#freeTierTeachingBubble"}
-          hasCloseButton
-          primaryButtonProps={{
-            text: "Next",
-            onClick: () => setStep(10),
-          }}
-          secondaryButtonProps={{
-            text: "Previous",
-            onClick: () => setStep(8),
-          }}
-          calloutProps={{ directionalHint: DirectionalHint.leftCenter }}
-          onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 9 of " + totalSteps}
-        >
-          Unlock everything Azure Cosmos DB has to offer When you&apos;re ready, upgrade to production.
-        </TeachingBubble>
-      );
-    case 10:
       return (
         <TeachingBubble
           headline="Congratulations!"
@@ -227,10 +180,10 @@ export const MongoQuickstartTutorial: React.FC = (): JSX.Element => {
           }}
           secondaryButtonProps={{
             text: "Previous",
-            onClick: () => (userContext.isTryCosmosDBSubscription ? setStep(9) : setStep(8)),
+            onClick: () => setStep(7),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step " + totalSteps + " of " + totalSteps}
+          footerContent="Step 8 of 8"
         >
           <Stack>
             <Text style={{ color: "white" }}>

src/Explorer/Quickstart/Tutorials/SQLQuickstartTutorial.tsx

@@ -1,4 +1,4 @@
-import { DirectionalHint, Link, Stack, TeachingBubble, Text } from "@fluentui/react";
+import { Link, Stack, TeachingBubble, Text } from "@fluentui/react";
 import { ReactTabKind, useTabs } from "hooks/useTabs";
 import { useTeachingBubble } from "hooks/useTeachingBubble";
 import React from "react";
@@ -17,10 +17,6 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
   if (userContext.apiType !== "SQL") {
     return <></>;
   }
-  let totalSteps = 8;
-  if (userContext.isTryCosmosDBSubscription) {
-    totalSteps = 9;
-  }
 
   switch (step) {
     case 1:
@@ -37,7 +33,7 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
             },
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 1 of " + totalSteps}
+          footerContent="Step 1 of 7"
         >
           Start viewing and working with your data by opening Items under Data
         </TeachingBubble>
@@ -59,7 +55,7 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(1),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 2 of " + totalSteps}
+          footerContent="Step 2 of 7"
         >
           View item here using the items window. Additionally you can also filter items to be reviewed with the filter
           function
@@ -82,7 +78,7 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(2),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 3 of " + totalSteps}
+          footerContent="Step 3 of 7"
         >
           Add new item by copy / pasting JSON; or uploading a JSON
         </TeachingBubble>
@@ -102,7 +98,7 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(3),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 4 of " + totalSteps}
+          footerContent="Step 4 of 7"
         >
           Query your data using either the filter function or new query.
         </TeachingBubble>
@@ -122,7 +118,7 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(4),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 5 of " + totalSteps}
+          footerContent="Step 5 of 7"
         >
           Change throughput provisioned to your container according to your needs
         </TeachingBubble>
@@ -142,54 +138,12 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
             onClick: () => setStep(5),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 6 of " + totalSteps}
+          footerContent="Step 6 of 7"
         >
           Visualize your data, store queries in an interactive document
         </TeachingBubble>
       );
     case 7:
-      return (
-        <TeachingBubble
-          headline="Launch full screen"
-          target={"#openFullScreenBtn"}
-          hasCloseButton
-          primaryButtonProps={{
-            text: "Next",
-            onClick: () => (userContext.isTryCosmosDBSubscription ? setStep(8) : setStep(9)),
-          }}
-          secondaryButtonProps={{
-            text: "Previous",
-            onClick: () => setStep(6),
-          }}
-          onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 7 of " + totalSteps}
-        >
-          This will open a new tab in your browser to use Cosmos DB Explorer. Using the provided URLs you can share
-          read-write or read-only access with other people.
-        </TeachingBubble>
-      );
-    case 8:
-      return (
-        <TeachingBubble
-          headline="Boost your experience"
-          target={"#freeTierTeachingBubble"}
-          hasCloseButton
-          primaryButtonProps={{
-            text: "Next",
-            onClick: () => setStep(9),
-          }}
-          secondaryButtonProps={{
-            text: "Previous",
-            onClick: () => setStep(7),
-          }}
-          calloutProps={{ directionalHint: DirectionalHint.leftCenter }}
-          onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step 8 of " + totalSteps}
-        >
-          Unlock everything Azure Cosmos DB has to offer When you&apos;re ready, upgrade to production.
-        </TeachingBubble>
-      );
-    case 9:
       return (
         <TeachingBubble
           headline="Congratulations!"
@@ -204,10 +158,10 @@ export const SQLQuickstartTutorial: React.FC = (): JSX.Element => {
           }}
           secondaryButtonProps={{
             text: "Previous",
-            onClick: () => (userContext.isTryCosmosDBSubscription ? setStep(8) : setStep(7)),
+            onClick: () => setStep(6),
           }}
           onDismiss={() => onDimissTeachingBubble()}
-          footerContent={"Step " + totalSteps + " of " + totalSteps}
+          footerContent="Step 7 of 7"
         >
           <Stack>
             <Text style={{ color: "white" }}>

src/Explorer/SplashScreen/SplashScreen.tsx

@@ -116,14 +116,7 @@ export class SplashScreen extends React.Component<SplashScreenProps> {
         <form className="connectExplorerFormContainer">
           <div className="splashScreenContainer">
             <div className="splashScreen">
-              <div
-                className="title"
-                aria-label={
-                  userContext.apiType === "Postgres"
-                    ? "Welcome to Azure Cosmos DB for PostgreSQL"
-                    : "Welcome to Azure Cosmos DB"
-                }
-              >
+              <div className="title">
                 {userContext.apiType === "Postgres"
                   ? "Welcome to Azure Cosmos DB for PostgreSQL"
                   : "Welcome to Azure Cosmos DB"}

src/Explorer/Tabs/Tabs.tsx

@@ -92,7 +92,6 @@ function TabNav({ tab, active, tabKind }: { tab?: Tab; active: boolean; tabKind?
         }
       }}
       className={active ? "active tabList" : "tabList"}
-      style={active ? { fontWeight: "bolder" } : {}}
       title={useObservable(tab?.tabPath || ko.observable(""))}
       aria-selected={active}
       aria-expanded={active}

src/Main.tsx

@@ -80,7 +80,6 @@ const App: React.FunctionComponent = () => {
   return (
     <div className="flexContainer">
       <div id="divExplorer" className="flexContainer hideOverflows">
-        <div id="freeTierTeachingBubble"> </div>
         {/* Main Command Bar - Start */}
         <CommandBar container={explorer} />
         {/* Collections Tree and Tabs - Begin */}

src/Utils/AuthorizationUtils.ts

@@ -49,7 +49,7 @@ export function getMsalInstance() {
       cacheLocation: "localStorage",
     },
     auth: {
-      authority: `${configContext.AAD_ENDPOINT}organizations`,
+      authority: `${configContext.AAD_ENDPOINT}common`,
       clientId: "203f1145-856a-4232-83d4-a43568fba23d",
     },
   };