Chore: Release 9.6.0

config/webpackDevServer.config.js

@@ -45,7 +45,9 @@ module.exports = function (proxy, allowedHost) {
         port: sockPort
       },
       overlay:{
-        errors: true,
+        runtimeErrors: (error) => {
+          return (error.message !== 'ResizeObserver loop limit exceeded');
+        },
         warnings: false
       }
     },

package.json

@@ -1,19 +1,19 @@
 {
         "name": "graph-explorer-v2",
-        "version": "9.5.0",
+        "version": "9.6.0",
         "private": true,
         "dependencies": {
                 "@augloop/types-core": "file:packages/types-core-2.16.189.tgz",
-                "@axe-core/webdriverjs": "4.8.1",
-                "@azure/msal-browser": "3.5.0",
+                "@axe-core/webdriverjs": "4.8.4",
+                "@azure/msal-browser": "3.10.0",
                 "@babel/core": "7.23.3",
                 "@babel/runtime": "7.23.8",
                 "@fluentui/react": "8.112.5",
                 "@fluentui/react-icons-mdl2": "1.3.52",
                 "@microsoft/applicationinsights-react-js": "17.0.3",
                 "@microsoft/applicationinsights-web": "3.0.5",
                 "@microsoft/microsoft-graph-client": "3.0.7",
-                "@monaco-editor/react": "4.5.1",
+                "@monaco-editor/react": "4.6.0",
                 "@ms-ofb/officebrowserfeedbacknpm": "file:packages/officebrowserfeedbacknpm-1.6.6.tgz",
                 "adaptive-expressions": "4.21.4",
                 "adaptivecards": "3.0.2",
@@ -26,21 +26,21 @@
                 "bfj": "8.0.0",
                 "bootstrap": "5.3.2",
                 "case-sensitive-paths-webpack-plugin": "2.4.0",
-                "css-loader": "6.8.1",
-                "dotenv": "16.3.1",
+                "css-loader": "6.10.0",
+                "dotenv": "16.4.2",
                 "dotenv-expand": "10.0.0",
                 "eslint-config-react-app": "7.0.1",
                 "eslint-plugin-react": "7.33.2",
                 "eslint-webpack-plugin": "4.0.1",
                 "express": "4.18.2",
                 "expvariantassignmentsdk": "file:packages/expvariantassignmentsdk-1.0.0.tgz",
                 "file-loader": "6.2.0",
-                "fork-ts-checker-webpack-plugin": "8.0.0",
+                "fork-ts-checker-webpack-plugin": "9.0.2",
                 "fs-extra": "11.1.1",
                 "guid-typescript": "1.0.9",
                 "isomorphic-fetch": "3.0.0",
                 "localforage": "1.10.0",
-                "mini-css-extract-plugin": "2.7.6",
+                "mini-css-extract-plugin": "2.8.0",
                 "monaco-editor": "0.30.1",
                 "monaco-editor-webpack-plugin": "6.0.0",
                 "office-ui-fabric-core": "11.1.0",
@@ -54,14 +54,14 @@
                 "react-redux": "8.1.3",
                 "redux": "4.2.1",
                 "redux-thunk": "2.4.2",
-                "resolve": "1.22.2",
+                "resolve": "1.22.8",
                 "sass": "1.69.7",
                 "sass-loader": "13.3.2",
                 "style-loader": "3.3.3",
                 "typescript": "5.3.3",
                 "url": "0.11.1",
                 "url-loader": "4.1.1",
-                "webpack": "5.88.2",
+                "webpack": "5.90.1",
                 "webpack-dev-server": "4.15.1",
                 "webpack-manifest-plugin": "5.0.0",
                 "workbox-webpack-plugin": "7.0.0"
@@ -93,22 +93,22 @@
                 "@axe-core/playwright": "4.7.3",
                 "@playwright/test": "1.40.1",
                 "@types/chromedriver": "81.0.1",
-                "@types/isomorphic-fetch": "0.0.36",
-                "@types/jest": "29.5.8",
+                "@types/isomorphic-fetch": "0.0.39",
+                "@types/jest": "29.5.12",
                 "@types/lodash.debounce": "4.0.9",
-                "@types/react": "18.2.47",
-                "@types/react-dom": "18.2.15",
+                "@types/react": "18.2.55",
+                "@types/react-dom": "18.2.19",
                 "@types/react-redux": "7.1.30",
                 "@types/redux-logger": "3.0.11",
                 "@types/redux-mock-store": "1.0.3",
                 "@types/selenium-webdriver": "4.1.21",
-                "@typescript-eslint/eslint-plugin": "6.18.1",
+                "@typescript-eslint/eslint-plugin": "6.20.0",
                 "@typescript-eslint/parser": "6.17.0",
-                "acorn": "8.10.0",
+                "acorn": "8.11.3",
                 "babel-jest": "29.7.0",
                 "chromedriver": "119.0.1",
                 "eslint": "8.56.0",
-                "html-webpack-plugin": "5.5.3",
+                "html-webpack-plugin": "5.6.0",
                 "jest": "29.7.0",
                 "jest-canvas-mock": "2.5.2",
                 "jest-environment-jsdom": "29.7.0",
@@ -119,9 +119,9 @@
                 "react-dev-utils": "12.0.1",
                 "redux-logger": "3.0.6",
                 "redux-mock-store": "1.5.4",
-                "selenium-webdriver": "4.16.0",
-                "start-server-and-test": "2.0.1",
-                "ts-jest": "29.1.1"
+                "selenium-webdriver": "4.17.0",
+                "start-server-and-test": "2.0.3",
+                "ts-jest": "29.1.2"
         },
         "jestSonar": {
                 "reportPath": "reports",

src/app/services/reducers/permissions-reducer.spec.ts

@@ -71,7 +71,11 @@ describe('Permissions reducer', () => {
     }
     const expectedState = {
       pending: { isSpecificPermissions: false, isFullPermissions: false },
-      data: {},
+      data: {
+        specificPermissions: [],
+        fullPermissions: [],
+        tenantWidePermissionsGrant: []
+      },
       error: 'error'
     }
 

src/app/services/reducers/permissions-reducer.ts

@@ -43,7 +43,7 @@ export function scopes(state: IScopes = initialState, action: AppAction): any {
       return {
         pending: { isFullPermissions: false, isSpecificPermissions: false },
         error: action.response,
-        data: {}
+        data: initialState.data
       };
     case FETCH_URL_SCOPES_PENDING:
       return {

src/app/views/query-response/QueryResponse.tsx

@@ -107,7 +107,7 @@ const QueryResponse = () => {
           flex: 1
         }} onScroll={onScroll}>
           <Pivot overflowBehavior='menu'
-            overflowAriaLabel={translateMessage('More items')}
+            overflowAriaLabel={translateMessage('More response items')}
             onLinkClick={handlePivotItemClick}
             className={'pivot-response'}
             selectedKey={currentTab}

src/app/views/query-runner/request/Request.tsx

@@ -185,7 +185,7 @@ const Request = (props: any) => {
         <div className='query-request'>
           <Pivot
             overflowBehavior='menu'
-            overflowAriaLabel={translateMessage('More items')}
+            overflowAriaLabel={translateMessage('More request area items')}
             onLinkClick={handlePivotItemClick}
             className='pivot-request'
             selectedKey={pivot}

src/messages/GE.json

@@ -496,5 +496,7 @@
   "Unable to dissent": "Unable to dissent",
   "Unable to dissent. You require the following permissions to revoke": "Unable to dissent. You require Directory.Read.All and DelegatedPermissionGrant.ReadWrite.All to be able to revoke consent to permissions",
   "Revoking admin granted scopes": "Revoking admin granted scopes",
-  "Revoking default scopes": "Revoking default scopes"
+  "Revoking default scopes": "Revoking default scopes",
+  "More request area items": "More request area items",
+  "More response items": "More response area items"
 }

src/styles/index.scss

@@ -8,3 +8,4 @@
   padding-top: 0px !important;
 }
 
+iframe#webpack-dev-server-client-overlay{display:none!important}

src/tests/ui/anonymous-experiences/header.spec.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/no-unsafe-call */
 /* eslint-disable max-len */
 import { test, expect, Page } from '@playwright/test';
 
@@ -11,40 +12,40 @@ test.beforeAll(async ({ browser }) => {
 test.describe('Settings button', () => {
   test('should change theme settings', async () => {
 
-    const settingsButton = page.locator('[aria-label="Settings"]');
+    const settingsButton = page.getByLabel('Settings');
     await settingsButton.click();
-    const changeThemeButton = page.locator('button[role="menuitem"]:has-text("Change theme")');
+    const changeThemeButton = page.getByRole('menuitem', { name: 'Change theme' });
     await changeThemeButton.click();
     await page.evaluate(() => document.fonts.ready);
     await page.waitForTimeout(200);
     expect(await page.screenshot({ clip: { x: 300, y: 0, width: 1920, height: 1080 } })).toMatchSnapshot();
     await page.locator('text=Dark').click();
-    const closeThemeDialogButton = page.locator('button:has-text("Close")');
+    const closeThemeDialogButton = page.getByRole('button', { name: 'Close' });
     await closeThemeDialogButton.click();
-    await page.locator('[aria-label="Settings"]').click();
-    await changeThemeButton.click();
-    await page.locator('text=High contrast').click();
     await page.evaluate(() => document.fonts.ready);
     await page.waitForTimeout(200);
+    await settingsButton.click();
+    await changeThemeButton.click();
+    await page.locator('text=High contrast').click();
     expect(await page.screenshot({ clip: { x: 300, y: 0, width: 1920, height: 1080 } })).toMatchSnapshot();
     await closeThemeDialogButton.click();
+    await page.evaluate(() => document.fonts.ready);
+    await page.waitForTimeout(200);
     await settingsButton.click();
     await changeThemeButton.click();
     await page.locator('text=Light').click();
-    await page.evaluate(() => document.fonts.ready);
-    await page.waitForTimeout(200);
     expect(await page.screenshot({ clip: { x: 300, y: 0, width: 1920, height: 1080 } })).toMatchSnapshot();
     await page.locator('text=Close').click();
   });
 
   test('should get a sandbox with sample data', async () => {
     test.slow();
-    await page.locator('[aria-label="Settings"]').click();
     await page.evaluate(() => document.fonts.ready);
-    await page.waitForTimeout(700);
+    await page.waitForTimeout(200);
+    await page.getByLabel('Settings').click();
     const [page1] = await Promise.all([
       page.waitForEvent('popup'),
-      page.locator('text=Get a sandbox with sample data').click()
+      await page.getByRole('menuitem', { name: 'Get a sandbox with sample data' }).click()
     ]);
     expect(page1.url()).toBe('https://developer.microsoft.com/en-US/microsoft-365/dev-program');
   })

src/tests/ui/anonymous-experiences/sidebar.spec.ts

@@ -14,8 +14,8 @@ test.describe('Resources Explorer', () => {
     await page.evaluate(() => document.fonts.ready);
     await page.waitForTimeout(200);
     expect(await page.screenshot()).toMatchSnapshot();
-    await page.locator('text=admin (5)').click();
-    await page.locator('text=admin').nth(1).click();
+    await page.getByLabel('admin (6)').click();
+    await page.getByRole('link', { name: 'GET' }).click();
     await page.waitForTimeout(200);
     await page.evaluate(() => document.fonts.ready);
     expect(await page.screenshot()).toMatchSnapshot();
@@ -79,18 +79,18 @@ test.describe.serial('Sample Query tab', () => {
     await page.evaluate(() => document.fonts.ready);
     await page.waitForTimeout(200);
     expect(await page.screenshot()).toMatchSnapshot();
-    await page.locator('[placeholder="Search sample queries"]').click();
-    await page.locator('[placeholder="Search sample queries"]').fill('drive');
+    await page.getByPlaceholder('Search sample queries').click();
+    await page.getByPlaceholder('Search sample queries').fill('drive');
     await page.evaluate(() => document.fonts.ready);
     expect(await page.screenshot()).toMatchSnapshot();
     await page.locator('[aria-label="list items in my drive"]').click();
     await page.evaluate(() => document.fonts.ready);
     await page.waitForTimeout(200);
     expect(await page.screenshot()).toMatchSnapshot();
-    await page.getByRole('row', { name: 'OneDrive has 5 results 4 of 6' }).getByRole('button', { name: 'expand collapse group' }).click();
+    await page.getByLabel('OneDrive has 5 results 4 of').getByLabel('expand collapse group').click();
     await page.evaluate(() => document.fonts.ready);
     expect(await page.screenshot()).toMatchSnapshot();
-    await page.getByRole('gridcell', { name: 'my recent files' }).click();
+    await page.getByLabel('getmy recent files').click();
     await page.waitForTimeout(200);
     await page.evaluate(() => document.fonts.ready);
   })

src/tests/ui/responsiveness/mobile-responsive.spec.ts

@@ -51,7 +51,7 @@ test.describe('Sidebar navigation', () => {
 
 test.describe('Request area navigation', () => {
   test('should have permissions tab in overflow menu', async () => {
-    await page.getByRole('tablist').filter({hasText:'Request body' }).getByRole('button',{name: 'More items'}).click();
+    await page.getByLabel('More request area items').click();
     await page.getByRole('menuitem', { name: 'Modify permissions' }).click();
     await page.evaluate(() => document.fonts.ready);
     await page.waitForTimeout(500);
@@ -60,15 +60,17 @@ test.describe('Request area navigation', () => {
   })
 
   test('should have access token tab in overflow menu', async () => {
-    await page.getByRole('tablist').filter({hasText:'Request body' }).getByRole('button',{name: 'More items'}).click();
+    await page.getByLabel('More request area items').click();
     await page.getByRole('menuitem', { name: 'Access token' }).click();
     page.getByText('To view your access token, sign in to Graph Explorer.');
     expect(await page.screenshot()).toMatchSnapshot();
   })
 });
 test.describe('Response area navigation', () => {
   test('should have code snippets tab in overflow menu', async () => {
-    await page.getByRole('tablist').filter({hasText:'Response preview'}).getByRole('button',{name:'More items' }).click();
+    await page.evaluate(() => document.fonts.ready);
+    await page.waitForTimeout(200);
+    await page.getByLabel('More response area items').click();
     await page.getByRole('menuitem', { name: 'Code snippets' }).click();
     await page.getByRole('tab', { name: 'C# C#' }).click();
     await page.evaluate(() => document.fonts.ready);
@@ -82,7 +84,7 @@ test.describe('Response area navigation', () => {
     await page.getByRole('button', { name: 'Run query' }).click();
     await page.evaluate(() => document.fonts.ready);
     await page.waitForTimeout(1000);
-    await page.getByRole('tablist').filter({ hasText: 'Response preview' }).getByRole('button', { name: 'More items' }).click();
+    await page.getByLabel('More response area items').click();
     await page.getByRole('menuitem', { name: 'Adaptive cards' }).click();
     await page.getByRole('tabpanel', { name: 'Adaptive cards' }).getByRole('tab', { name: 'Card' }).click();
     expect(page.getByText('Megan Bowen')).toBeDefined();
@@ -93,17 +95,17 @@ test.describe('Response area navigation', () => {
     expect(await page.screenshot()).toMatchSnapshot();
   })
   test('should have toolkit component tab in overflow menu', async () => {
-    await page.getByRole('tablist').filter({ hasText: 'Response preview' }).getByRole('button', { name: 'More items' }).click();
+    await page.getByLabel('More response area items').click();
     await page.getByRole('menuitem', { name: 'Toolkit component' }).click();
-    await page.waitForTimeout(500);
+    await page.waitForTimeout(700);
     await page.evaluate(() => document.fonts.ready);
     expect(page.locator('text=Open this example in')).toBeDefined();
     expect(await page.screenshot()).toMatchSnapshot();
   });
   test('should have expand component tab in overflow menu', async () => {
-    await page.getByRole('tablist').filter({ hasText: 'Response preview' }).getByRole('button', { name: 'More items' }).click();
+    await page.getByLabel('More response area items').click();
     await page.getByRole('menuitem', { name: 'Expand response' }).click();
-    await page.getByRole('button', { name: 'More items' }).click();
+    await page.getByRole('tab', { name: 'More items' }).click();
     await page.getByRole('menuitem', { name: 'Code snippets' }).click();
     await page.getByRole('tab', { name: 'C# C#' }).click();
     await page.evaluate(() => document.fonts.ready);