Show an error message snackbar for directory errors with overrides

Fixed: 412841634
Change-Id: I2849d35c5140f1b6fd3c4a8b76fbd43b4b410cb2
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6770020
Commit-Queue: Philip Pfaffe <[email protected]>
Auto-Submit: Philip Pfaffe <[email protected]>
Reviewed-by: Danil Somsikov <[email protected]>

Author: pfaffe

front_end/entrypoints/main/MainImpl.ts

@@ -55,6 +55,7 @@ import * as Workspace from '../../models/workspace/workspace.js';
 import * as Snippets from '../../panels/snippets/snippets.js';
 import * as Buttons from '../../ui/components/buttons/buttons.js';
 import * as IconButton from '../../ui/components/icon_button/icon_button.js';
+import * as Snackbar from '../../ui/components/snackbars/snackbars.js';
 import * as Components from '../../ui/legacy/components/utils/utils.js';
 import * as UI from '../../ui/legacy/legacy.js';
 import * as ThemeSupport from '../../ui/legacy/theme_support/theme_support.js';
@@ -397,6 +398,9 @@ export class MainImpl {
 
     // Request filesystems early, we won't create connections until callback is fired. Things will happen in parallel.
     const isolatedFileSystemManager = Persistence.IsolatedFileSystemManager.IsolatedFileSystemManager.instance();
+    isolatedFileSystemManager.addEventListener(
+        Persistence.IsolatedFileSystemManager.Events.FileSystemError,
+        event => Snackbar.Snackbar.Snackbar.show({message: event.data}));
 
     const defaultThemeSetting = 'systemPreferred';
     const themeSetting = Common.Settings.Settings.instance().createSetting('ui-theme', defaultThemeSetting);

front_end/models/persistence/IsolatedFileSystem.ts

@@ -35,7 +35,7 @@ import * as Platform from '../../core/platform/platform.js';
 import * as TextUtils from '../text_utils/text_utils.js';
 
 import {Events, type IsolatedFileSystemManager} from './IsolatedFileSystemManager.js';
-import {PlatformFileSystem, PlatformFileSystemType} from './PlatformFileSystem.js';
+import {Events as PlatformFileSystemEvents, PlatformFileSystem, PlatformFileSystemType} from './PlatformFileSystem.js';
 
 const UIStrings = {
   /**
@@ -58,6 +58,17 @@ const UIStrings = {
    *@example {example.url} PH1
    */
   linkedToS: 'Linked to {PH1}',
+  /**
+   *@description Error message shown when devtools failed to create a file system directory.
+   *@example {path/} PH1
+   */
+  createDirFailedBecausePathIsFile:
+      'Overrides: Failed to create directory {PH1} because the path exists and is a file.',
+  /**
+   *@description Error message shown when devtools failed to create a file system directory.
+   *@example {path/} PH1
+   */
+  createDirFailed: 'Overrides: Failed to create directory {PH1}. Are the workspace or overrides configured correctly?'
 } as const;
 const str_ = i18n.i18n.registerUIStrings('models/persistence/IsolatedFileSystem.ts', UIStrings);
 const i18nString = i18n.i18n.getLocalizedString.bind(undefined, str_);
@@ -210,6 +221,13 @@ export class IsolatedFileSystem extends PlatformFileSystem {
   private innerCreateFolderIfNeeded(path: string): Promise<DirectoryEntry|null> {
     return new Promise(resolve => {
       this.domFileSystem.root.getDirectory(path, {create: true}, dirEntry => resolve(dirEntry), error => {
+        this.domFileSystem.root.getFile(
+            path, undefined,
+            () => this.dispatchEventToListeners(
+                PlatformFileSystemEvents.FILE_SYSTEM_ERROR,
+                i18nString(UIStrings.createDirFailedBecausePathIsFile, {PH1: path})),
+            () => this.dispatchEventToListeners(
+                PlatformFileSystemEvents.FILE_SYSTEM_ERROR, i18nString(UIStrings.createDirFailed, {PH1: path})));
         const errorMessage = IsolatedFileSystem.errorMessage(error);
         console.error(errorMessage + ' trying to create directory \'' + path + '\'');
         resolve(null);

front_end/models/persistence/IsolatedFileSystemManager.ts

@@ -35,7 +35,11 @@ import * as Platform from '../../core/platform/platform.js';
 
 import type {FilesChangedData} from './FileSystemWorkspaceBinding.js';
 import {IsolatedFileSystem} from './IsolatedFileSystem.js';
-import {type PlatformFileSystem, PlatformFileSystemType} from './PlatformFileSystem.js';
+import {
+  Events as PlatformFileSystemEvents,
+  type PlatformFileSystem,
+  PlatformFileSystemType
+} from './PlatformFileSystem.js';
 
 const UIStrings = {
   /**
@@ -191,6 +195,7 @@ export class IsolatedFileSystemManager extends Common.ObjectWrapper.ObjectWrappe
         return null;
       }
       this.fileSystemsInternal.set(fileSystemURL, fileSystem);
+      fileSystem.addEventListener(PlatformFileSystemEvents.FILE_SYSTEM_ERROR, this.#onFileSystemError, this);
       if (dispatchEvent) {
         this.dispatchEventToListeners(Events.FileSystemAdded, fileSystem);
       }
@@ -200,6 +205,7 @@ export class IsolatedFileSystemManager extends Common.ObjectWrapper.ObjectWrappe
 
   addPlatformFileSystem(fileSystemURL: Platform.DevToolsPath.UrlString, fileSystem: PlatformFileSystem): void {
     this.fileSystemsInternal.set(fileSystemURL, fileSystem);
+    fileSystem.addEventListener(PlatformFileSystemEvents.FILE_SYSTEM_ERROR, this.#onFileSystemError, this);
     this.dispatchEventToListeners(Events.FileSystemAdded, fileSystem);
   }
 
@@ -225,6 +231,10 @@ export class IsolatedFileSystemManager extends Common.ObjectWrapper.ObjectWrappe
     }
   }
 
+  #onFileSystemError(event: Common.EventTarget.EventTargetEvent<string>): void {
+    this.dispatchEventToListeners(Events.FileSystemError, event.data);
+  }
+
   private onFileSystemRemoved(event: Common.EventTarget.EventTargetEvent<Platform.DevToolsPath.RawPathString>): void {
     const embedderPath = event.data;
     const fileSystemPath = Common.ParsedURL.ParsedURL.rawPathToUrlString(embedderPath);
@@ -233,6 +243,7 @@ export class IsolatedFileSystemManager extends Common.ObjectWrapper.ObjectWrappe
       return;
     }
     this.fileSystemsInternal.delete(fileSystemPath);
+    isolatedFileSystem.removeEventListener(PlatformFileSystemEvents.FILE_SYSTEM_ERROR, this.#onFileSystemError, this);
     isolatedFileSystem.fileSystemRemoved();
     this.dispatchEventToListeners(Events.FileSystemRemoved, isolatedFileSystem);
   }
@@ -349,6 +360,7 @@ export enum Events {
   FileSystemFilesChanged = 'FileSystemFilesChanged',
   ExcludedFolderAdded = 'ExcludedFolderAdded',
   ExcludedFolderRemoved = 'ExcludedFolderRemoved',
+  FileSystemError = 'FileSystemError',
   /* eslint-enable @typescript-eslint/naming-convention */
 }
 
@@ -358,6 +370,7 @@ export interface EventTypes {
   [Events.FileSystemFilesChanged]: FilesChangedData;
   [Events.ExcludedFolderAdded]: Platform.DevToolsPath.EncodedPathString;
   [Events.ExcludedFolderRemoved]: Platform.DevToolsPath.EncodedPathString;
+  [Events.FileSystemError]: string;
 }
 
 let lastRequestId = 0;

front_end/models/persistence/PlatformFileSystem.ts

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import type * as Common from '../../core/common/common.js';
+import * as Common from '../../core/common/common.js';
 import * as i18n from '../../core/i18n/i18n.js';
 import type * as Platform from '../../core/platform/platform.js';
 import type * as TextUtils from '../text_utils/text_utils.js';
@@ -45,7 +45,15 @@ export enum PlatformFileSystemType {
   WORKSPACE_PROJECT = 'workspace-project',
 }
 
-export class PlatformFileSystem {
+export const enum Events {
+  FILE_SYSTEM_ERROR = 'file-system-error',
+}
+
+interface EventTypes {
+  [Events.FILE_SYSTEM_ERROR]: string;
+}
+
+export class PlatformFileSystem extends Common.ObjectWrapper.ObjectWrapper<EventTypes> {
   readonly #path: Platform.DevToolsPath.UrlString;
   #type: PlatformFileSystemType;
   /**
@@ -55,6 +63,7 @@ export class PlatformFileSystem {
   readonly automatic: boolean;
 
   constructor(path: Platform.DevToolsPath.UrlString, type: PlatformFileSystemType, automatic: boolean) {
+    super();
     this.#path = path;
     this.#type = type;
     this.automatic = automatic;