Improve e2e tests (#1125)

* Improve e2e tests * Fix stories. * Page objects. * Save file. * Rename screenshots. * Fix fixture. * Fix dropdowns. * Rename * assets tests
Squidex · Sep 6, 2024 · 1c70f9d · 1c70f9d
1 parent 81d9ca1
commit 1c70f9d
Show file tree

Hide file tree

Showing 60 changed files with 1,375 additions and 436 deletions.
diff --git a/backend/i18n/frontend_en.json b/backend/i18n/frontend_en.json
@@ -251,6 +251,7 @@
   "common.disabled": "Disabled",
   "common.displayName": "Display Name",
   "common.documentation": "Documentation",
+  "common.download": "Download",
   "common.edit": "Edit",
   "common.editing": "Editing",
   "common.editInNewTab": "Open in new tab",

diff --git a/backend/i18n/frontend_fr.json b/backend/i18n/frontend_fr.json
@@ -251,6 +251,7 @@
   "common.disabled": "Désactivé",
   "common.displayName": "Afficher un nom",
   "common.documentation": "Documentation",
+  "common.download": "Download",
   "common.edit": "Modifier",
   "common.editing": "Édition",
   "common.editInNewTab": "Open in new tab",

diff --git a/backend/i18n/frontend_it.json b/backend/i18n/frontend_it.json
@@ -251,6 +251,7 @@
   "common.disabled": "Disabled",
   "common.displayName": "Nome visualizzato",
   "common.documentation": "Documentation",
+  "common.download": "Download",
   "common.edit": "Modifica",
   "common.editing": "Editing",
   "common.editInNewTab": "Open in new tab",

diff --git a/backend/i18n/frontend_nl.json b/backend/i18n/frontend_nl.json
@@ -251,6 +251,7 @@
   "common.disabled": "Uitgezet",
   "common.displayName": "Weergavenaam",
   "common.documentation": "Documentation",
+  "common.download": "Download",
   "common.edit": "Bewerken",
   "common.editing": "Bewerken",
   "common.editInNewTab": "Open in new tab",

diff --git a/backend/i18n/frontend_pt.json b/backend/i18n/frontend_pt.json
@@ -251,6 +251,7 @@
   "common.disabled": "Deficientes",
   "common.displayName": "Nome do visor",
   "common.documentation": "Documentação",
+  "common.download": "Download",
   "common.edit": "Editar",
   "common.editing": "Edição",
   "common.editInNewTab": "Open in new tab",

diff --git a/backend/i18n/frontend_zh.json b/backend/i18n/frontend_zh.json
@@ -251,6 +251,7 @@
   "common.disabled": "已禁用",
   "common.displayName": "显示名称",
   "common.documentation": "Documentation",
+  "common.download": "Download",
   "common.edit": "编辑",
   "common.editing": "Editing",
   "common.editInNewTab": "Open in new tab",

diff --git a/backend/i18n/source/frontend_en.json b/backend/i18n/source/frontend_en.json
@@ -251,6 +251,7 @@
   "common.disabled": "Disabled",
   "common.displayName": "Display Name",
   "common.documentation": "Documentation",
+  "common.download": "Download",
   "common.edit": "Edit",
   "common.editing": "Editing",
   "common.editInNewTab": "Open in new tab",

diff --git a/backend/src/Squidex.Domain.Apps.Core.Model/Assets/Asset.cs b/backend/src/Squidex.Domain.Apps.Core.Model/Assets/Asset.cs
@@ -53,27 +53,27 @@ public Asset Annotate(string? fileName = null, string? slug = null, bool? isProt
 
         if (fileName != null && !string.Equals(FileName, fileName, StringComparison.OrdinalIgnoreCase))
         {
-            result = this with { FileName = fileName };
+            result = result with { FileName = fileName };
         }
 
         if (slug != null && !string.Equals(Slug, slug, StringComparison.OrdinalIgnoreCase))
         {
-            result = this with { Slug = slug };
+            result = result with { Slug = slug };
         }
 
         if (isProtected != null && IsProtected != isProtected.Value)
         {
-            result = this with { IsProtected = isProtected.Value };
+            result = result with { IsProtected = isProtected.Value };
         }
 
         if (tags != null && !Tags.SetEquals(tags))
         {
-            result = this with { Tags = tags };
+            result = result with { Tags = tags };
         }
 
         if (metadata != null && !Metadata.EqualsDictionary(metadata))
         {
-            result = this with { Metadata = metadata };
+            result = result with { Metadata = metadata };
         }
 
         return result;

diff --git a/backend/src/Squidex.Domain.Apps.Entities/Assets/SvgAssetMetadataSource.cs b/backend/src/Squidex.Domain.Apps.Entities/Assets/SvgAssetMetadataSource.cs
@@ -52,11 +52,28 @@ public async Task EnhanceAsync(UploadAssetCommand command,
 
                 if (!string.IsNullOrWhiteSpace(width) && !string.IsNullOrWhiteSpace(height))
                 {
-                    command.Metadata[KnownMetadataKeys.SvgWidth] = width;
-                    command.Metadata[KnownMetadataKeys.SvgHeight] = height;
+                    var hasNumericWidth = TryParseInt(width, out var w);
+                    var hasNumericHeight = TryParseInt(height, out var h);
 
-                    if (int.TryParse(width, NumberStyles.Integer, CultureInfo.InvariantCulture, out var w) &&
-                        int.TryParse(height, NumberStyles.Integer, CultureInfo.InvariantCulture, out var h))
+                    if (hasNumericWidth)
+                    {
+                        command.Metadata[KnownMetadataKeys.SvgWidth] = w;
+                    }
+                    else
+                    {
+                        command.Metadata[KnownMetadataKeys.SvgWidth] = width;
+                    }
+
+                    if (hasNumericWidth)
+                    {
+                        command.Metadata[KnownMetadataKeys.SvgHeight] = h;
+                    }
+                    else
+                    {
+                        command.Metadata[KnownMetadataKeys.SvgHeight] = height;
+                    }
+
+                    if (hasNumericWidth && hasNumericHeight)
                     {
                         command.Metadata[KnownMetadataKeys.PixelWidth] = w;
                         command.Metadata[KnownMetadataKeys.PixelHeight] = h;
@@ -79,6 +96,11 @@ public async Task EnhanceAsync(UploadAssetCommand command,
         }
     }
 
+    private static bool TryParseInt(string value, out int result)
+    {
+        return int.TryParse(value, NumberStyles.Integer, CultureInfo.InvariantCulture, out result);
+    }
+
     public IEnumerable<string> Format(Asset asset)
     {
         var isSvg =
@@ -90,8 +112,8 @@ public IEnumerable<string> Format(Asset asset)
             yield break;
         }
 
-        if (asset.Metadata.TryGetString(KnownMetadataKeys.SvgWidth, out var w) &&
-            asset.Metadata.TryGetString(KnownMetadataKeys.SvgHeight, out var h))
+        if (asset.Metadata.TryGetValue(KnownMetadataKeys.SvgWidth, out var w) &&
+            asset.Metadata.TryGetValue(KnownMetadataKeys.SvgHeight, out var h))
         {
             yield return $"{w}x{h}";
         }

diff --git a/backend/tests/Squidex.Domain.Apps.Core.Tests/Model/Assets/AssetTests.cs b/backend/tests/Squidex.Domain.Apps.Core.Tests/Model/Assets/AssetTests.cs
@@ -143,6 +143,23 @@ public void Should_annotate_with_metadata()
         Assert.Same(asset_1, asset_2);
     }
 
+    [Fact]
+    public void Should_annotate_with_multiple_properties()
+    {
+        var newSlug = "my-file.png";
+        var newFile = "My File";
+
+        var asset_1 = asset_0.Annotate(fileName: newFile, slug: newSlug);
+        var asset_2 = asset_1.Annotate(fileName: newFile, slug: newSlug);
+
+        Assert.NotSame(asset_0, asset_1);
+        Assert.Equal(newSlug, asset_1.Slug);
+        Assert.Equal(newSlug, asset_2.Slug);
+        Assert.Equal(newFile, asset_1.FileName);
+        Assert.Equal(newFile, asset_2.FileName);
+        Assert.Same(asset_1, asset_2);
+    }
+
     [Fact]
     public void Should_deserialize_state()
     {

diff --git a/backend/tests/Squidex.Domain.Apps.Entities.Tests/Assets/SvgAssetMetadataSourceTests.cs b/backend/tests/Squidex.Domain.Apps.Entities.Tests/Assets/SvgAssetMetadataSourceTests.cs
@@ -66,8 +66,24 @@ public async Task Should_not_throw_exception_if_svg_is_not_malicious()
         Assert.Equal(20, command.Metadata[KnownMetadataKeys.PixelWidth].AsNumber);
         Assert.Equal(30, command.Metadata[KnownMetadataKeys.PixelHeight].AsNumber);
 
-        Assert.Equal("20", command.Metadata[KnownMetadataKeys.SvgWidth].AsString);
-        Assert.Equal("30", command.Metadata[KnownMetadataKeys.SvgHeight].AsString);
+        Assert.Equal(20, command.Metadata[KnownMetadataKeys.SvgWidth].AsNumber);
+        Assert.Equal(30, command.Metadata[KnownMetadataKeys.SvgHeight].AsNumber);
+
+        Assert.Equal("0 0 100 100", command.Metadata[KnownMetadataKeys.SvgViewBox].AsString);
+    }
+
+    [Fact]
+    public async Task Should_annote_with_non_numeric_dimensions()
+    {
+        var command = Command("SvgValidNonNumberSizes.svg");
+
+        await sut.EnhanceAsync(command, default);
+
+        Assert.DoesNotContain(KnownMetadataKeys.PixelWidth, command.Metadata);
+        Assert.DoesNotContain(KnownMetadataKeys.PixelHeight, command.Metadata);
+
+        Assert.Equal("20%", command.Metadata[KnownMetadataKeys.SvgWidth].AsString);
+        Assert.Equal("30%", command.Metadata[KnownMetadataKeys.SvgHeight].AsString);
 
         Assert.Equal("0 0 100 100", command.Metadata[KnownMetadataKeys.SvgViewBox].AsString);
     }
@@ -103,7 +119,25 @@ public void Should_describe_metadata()
 
         var formatted = sut.Format(source);
 
-        Assert.Equal(new[] { "128x55" }, formatted);
+        Assert.Equal(["128x55"], formatted);
+    }
+
+    [Fact]
+    public void Should_describe_metadata_with_number()
+    {
+        var source = CreateAsset() with
+        {
+            Metadata = new AssetMetadata
+            {
+                [KnownMetadataKeys.SvgWidth] = 128,
+                [KnownMetadataKeys.SvgHeight] = 55
+            },
+            MimeType = "image/svg+xml"
+        };
+
+        var formatted = sut.Format(source);
+
+        Assert.Equal(["128x55"], formatted);
     }
 
     private static UploadAssetCommand Command(string path)

diff --git a/.../Squidex.Domain.Apps.Entities.Tests/Assets/TestFiles/SvgValidNonNumberSizes.svg b/.../Squidex.Domain.Apps.Entities.Tests/Assets/TestFiles/SvgValidNonNumberSizes.svg
diff --git a/backend/tests/Squidex.Domain.Apps.Entities.Tests/Squidex.Domain.Apps.Entities.Tests.csproj b/backend/tests/Squidex.Domain.Apps.Entities.Tests/Squidex.Domain.Apps.Entities.Tests.csproj
@@ -70,6 +70,9 @@
     <None Update="Assets\TestFiles\SvgNonPixelDimensions.svg">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </None>
+    <None Update="Assets\TestFiles\SvgValidNonNumberSizes.svg">
+      <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
+    </None>
     <None Update="Assets\TestFiles\SvgValid.svg">
       <CopyToOutputDirectory>PreserveNewest</CopyToOutputDirectory>
     </None>

diff --git a/frontend/.storybook/main.js b/frontend/.storybook/main.js
@@ -24,9 +24,11 @@ module.exports = {
      */
     config.plugins.push(new CopyPlugin({
         patterns: [
-            { from: './node_modules/ace-builds/src-min/', to: 'dependencies/ace/' },
+            { from: './node_modules/ace-builds/src-min/', to: './dependencies/ace/' },
         ]
     }));
+
+    config.resolve?.extensions?.push('.d.ts');
     return config;
   },
   docs: {

diff --git a/frontend/.storybook/tsconfig.json b/frontend/.storybook/tsconfig.json
@@ -1,9 +1,6 @@
 {
   "extends": "../tsconfig.app.json",
   "compilerOptions": {
-    "types": [
-      "node"
-    ],
     "allowSyntheticDefaultImports": true
   },
   "exclude": [

diff --git a/frontend/angular.json b/frontend/angular.json
@@ -127,7 +127,7 @@
                   "inlineCritical": false
                 },
                 "fonts": true
-              },
+              }
             },
             "development": {
               "extractLicenses": false,

diff --git a/frontend/package.json b/frontend/package.json
@@ -33,7 +33,6 @@
     "@lithiumjs/angular": "^8.0.0",
     "@lithiumjs/ngx-virtual-scroll": "^0.3.2",
     "@marker.io/browser": "^0.19.0",
-    "@types/ace": "^0.0.52",
     "ace-builds": "^1.34.2",
     "angular-gridster2": "18.0.1",
     "angular-mentions": "1.5.0",
@@ -95,6 +94,7 @@
     "@storybook/addon-links": "^8.1.5",
     "@storybook/angular": "^8.1.5",
     "@storybook/testing-library": "^0.2.2",
+    "@types/ace": "^0.0.52",
     "@types/codemirror": "5.60.15",
     "@types/core-js": "2.5.8",
     "@types/jasmine": "5.1.4",

diff --git a/frontend/src/app/features/content/pages/content/content-page.component.ts b/frontend/src/app/features/content/pages/content/content-page.component.ts
@@ -280,17 +280,23 @@ export class ContentPageComponent implements CanComponentDeactivate, OnInit {
             this.contentsState.create(value, publish, this.contentId)
                 .subscribe({
                     next: content => {
-                        if (navigationMode == 'Edit') {
-                            this.contentForm.submitCompleted({ noReset: true });
-                            this.contentForm.load(content.data, true);
+                        switch (navigationMode) {
+                            case 'Add':
+                                this.contentForm = new EditContentForm(this.languages, this.schema, this.schemasState.schemaMap, this.formContext);
+                                break;
 
-                            this.router.navigate([content.id, 'history'], { relativeTo: this.route.parent! });
-                        } else if (navigationMode === 'Close') {
-                            this.autoSaveIgnore = true;
+                            case 'Edit':
+                                this.contentForm.submitCompleted({ noReset: true });
+                                this.contentForm.load(content.data, true);
 
-                            this.router.navigate(['./'], { relativeTo: this.route.parent! });
-                        } else {
-                            this.contentForm = new EditContentForm(this.languages, this.schema, this.schemasState.schemaMap, this.formContext);
+                                this.router.navigate([content.id, 'history'], { relativeTo: this.route.parent! });
+                                break;
+
+                            case 'Close':
+                                this.autoSaveIgnore = true;
+
+                                this.router.navigate(['./'], { relativeTo: this.route.parent! });
+                                break;
                         }
                     },
                     error: error => {

diff --git a/frontend/src/app/features/schemas/pages/schema/fields/field-wizard.component.html b/frontend/src/app/features/schemas/pages/schema/fields/field-wizard.component.html
@@ -9,7 +9,7 @@
 
     <ng-container content>
         @if (editForm) {
-            <form class="edit-form" [formGroup]="editForm.form" (ngSubmit)="save()">
+            <form class="edit-form" [formGroup]="editForm.form" (ngSubmit)="save('Close')">
                 <sqx-field-form
                     [field]="field"
                     [fieldForm]="editForm.form"
@@ -20,7 +20,7 @@
                     [settings]="settings"></sqx-field-form>
             </form>
         } @else {
-            <form [formGroup]="addFieldForm.form" (ngSubmit)="addField(false)">
+            <form [formGroup]="addFieldForm.form" (ngSubmit)="addField('Close')">
                 <sqx-form-error [error]="addFieldForm.error | async"></sqx-form-error>
                 <div class="form-group">
                     <div class="row">
@@ -88,8 +88,8 @@
 
         @if (!editForm) {
             <div>
-                <div class="btn-group ms-2" attr.aria-label="{{ 'schemas.addFieldAndClose' | sqxTranslate }}" role="group">
-                    <button class="btn btn-success" (click)="addField(false)" shortcut="CTRL + SHIFT + S">
+                <div class="btn-group ms-2" attr.aria-label="{{ 'schemas.addField' | sqxTranslate }}" role="group">
+                    <button class="btn btn-success" (click)="addField('Close')" shortcut="CTRL + SHIFT + S">
                         {{ "schemas.addFieldAndClose" | sqxTranslate }}
                     </button>
                     <button
@@ -106,10 +106,10 @@
                         scrollY="true"
                         [sqxAnchoredTo]="buttonSave"
                         *sqxModal="addFieldModal; closeAlways: true">
-                        <a class="dropdown-item" (click)="addField(true)">
+                        <a class="dropdown-item" (click)="addField('Add')">
                             {{ "schemas.addFieldAndCreate" | sqxTranslate }}
                         </a>
-                        <a class="dropdown-item" (click)="addField(false, true)">
+                        <a class="dropdown-item" (click)="addField('Edit')">
                             {{ "schemas.addFieldAndEdit" | sqxTranslate }}
                         </a>
                     </sqx-dropdown-menu>
@@ -119,13 +119,9 @@
 
         @if (editForm) {
             <div>
-                <div
-                    class="btn-group ms-2"
-                    attr.aria-label="{{ 'schemas.addFieldAndClose' | sqxTranslate }}"
-                    position="top-end"
-                    role="group">
-                    <button class="btn btn-primary" (click)="save(true)" shortcut="CTRL + SHIFT + S">
-                        {{ "schemas.saveFieldAndNew" | sqxTranslate }}
+                <div class="btn-group ms-2" attr.aria-label="{{ 'schemas.saveField' | sqxTranslate }}" role="group">
+                    <button class="btn btn-primary" (click)="save('Close')" shortcut="CTRL + SHIFT + S">
+                        {{ "schemas.saveFieldAndClose" | sqxTranslate }}
                     </button>
                     <button
                         class="btn btn-primary"
@@ -141,8 +137,8 @@
                         scrollY="true"
                         [sqxAnchoredTo]="buttonSave"
                         *sqxModal="addFieldModal; closeAlways: true">
-                        <a class="dropdown-item" (click)="save()">
-                            {{ "schemas.saveFieldAndClose" | sqxTranslate }}
+                        <a class="dropdown-item" (click)="save('Add')">
+                            {{ "schemas.saveFieldAndNew" | sqxTranslate }}
                         </a>
                     </sqx-dropdown-menu>
                 </div>