test: updated text for minimal and bundle

Author: egordidenko

src/blocks/DropArea/DropArea.ts

@@ -55,6 +55,16 @@ export class DropArea extends LitUploaderBlock {
   @state()
   private _dropTextKey = 'drop-files-here';
 
+  private _isMultiple = false;
+  private _updateDropText(): void {
+    const customText = this.text;
+    if (typeof customText === 'string' && customText.length > 0) {
+      this._dropTextKey = this.l10n(customText) || customText;
+      return;
+    }
+    this._dropTextKey = this._isMultiple ? this.l10n('drop-files-here') : this.l10n('drop-file-here');
+  }
+
   private _destroyDropzone: (() => void) | null = null;
   private _destroyContentWrapperDropzone: (() => void) | null = null;
   private _contentWrapperRef: Ref<HTMLDivElement> = createRef();
@@ -141,22 +151,22 @@ export class DropArea extends LitUploaderBlock {
     });
 
     this.subConfigValue('multiple', (val) => {
-      const customText = this.text;
-      if (typeof customText === 'string' && customText.length > 0) {
-        this._dropTextKey = this.l10n(customText) || customText;
-        return;
-      }
-      this._dropTextKey = val ? this.l10n('drop-files-here') : this.l10n('drop-file-here');
+      this._isMultiple = Boolean(val);
+      this._updateDropText();
     });
   }
 
-  protected override willUpdate(changedProperties: PropertyValues<this>): void {
+  protected override willUpdate(changedProperties: PropertyValues<this & { localeId: string }>): void {
     super.willUpdate(changedProperties);
 
     if (changedProperties.has('disabled')) {
       this._updateIsEnabled();
       this._updateVisibility();
     }
+
+    if (changedProperties.has('text') || changedProperties.has('localeId')) {
+      this._updateDropText();
+    }
   }
 
   protected override updated(changedProperties: PropertyValues<this>): void {

tests/bundles.e2e.test.tsx

@@ -158,7 +158,7 @@ describe('Bundles', () => {
       </>,
     );
 
-    await expect.element(page.getByText('Choose file', { exact: true })).toBeVisible();
+    await expect.element(page.getByText('Choose files', { exact: true })).toBeVisible();
   });
 
   test('web/uc-file-uploader-regular.min.js', async () => {

tests/file-uploader-minimal.e2e.test.tsx

@@ -25,11 +25,11 @@ beforeEach(() => {
 describe('File uploader minimal', () => {
   describe('Upload button', () => {
     it('should be rendered', async () => {
-      await expect.element(page.getByText('Choose file', { exact: true })).toBeVisible();
+      await expect.element(page.getByText('Choose files', { exact: true })).toBeVisible();
     });
 
     it('should open file dialog on click', async () => {
-      await page.getByText('Choose file', { exact: true }).click();
+      await page.getByText('Choose files', { exact: true }).click();
       const startFrom = page.getByTestId('uc-start-from');
       await expect(startFrom).toBeDefined();
     });
@@ -46,7 +46,7 @@ describe('File uploader minimal', () => {
     });
 
     it('should open cloud image editor modal on edit button click', async () => {
-      await page.getByText('Choose file', { exact: true }).click();
+      await page.getByText('Choose files', { exact: true }).click();
       const startFrom = page.getByTestId('uc-start-from');
       const uploadList = page.getByTestId('uc-upload-list');