@xiriframework/xiri-ng 0.3.2 → 0.4.0

package/fesm2022/xiriframework-xiri-ng.mjs

@@ -2904,7 +2904,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
         }], propDecorators: { text: [{ type: i0.Input, args: [{ isSignal: true, alias: "text", required: true }] }] } });
 
 class XiriDownloadService {
-    download(result, filename, open) {
+    /**
+     * Opens an empty tab and returns its handle for a later download( …, tab ).
+     *
+     * MUST be called synchronously from the click handler: after an HTTP round trip the
+     * transient user activation is gone and the browser blocks the popup. Returns null
+     * when it was blocked anyway — pass that through, download() then saves the file.
+     */
+    openTab() {
+        return window.open('about:blank', '_blank');
+    }
+    /**
+     * Turns the response body into a file. With a tab handle from openTab() the file is
+     * displayed in that tab, otherwise it is saved via a download anchor.
+     */
+    download(result, filename, tab) {
         const contentDisposition = result.headers.get('content-disposition');
         if (contentDisposition) {
             filename = contentDisposition.split('filename=')[1];
@@ -2913,9 +2927,14 @@ class XiriDownloadService {
         const contentType = result.headers.get('content-type') ?? undefined;
         const file = new File([result.body], filename, { type: contentType });
         const fileData = URL.createObjectURL(file);
-        if (open) {
-            const ret = window.open(fileData, '_blank');
-            return !(ret === null || typeof (ret) == 'undefined');
+        if (tab) {
+            // ponytail: caps window.opener reach. A blob: document is same-origin anyway, so this is
+            // no licence to display untrusted HTML — only a correct Content-Type keeps it a viewer.
+            tab.opener = null;
+            tab.location.replace(fileData);
+            // ponytail: 60s is plenty to load; without it the blob lives until the page reloads.
+            setTimeout(() => URL.revokeObjectURL(fileData), 60 * 1000);
+            return true;
         }
         const a = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
         a.download = filename;
@@ -3162,7 +3181,7 @@ class XiriDialogComponent {
             });
         }, this.refreshTime);
     }
-    download(data) {
+    download(data, tab) {
         if (data === null) {
             // TODO: fix, this is actually an external link
             const file = window.open(this.dataService.getConfigApi() + this.url, 'Report');
@@ -3182,7 +3201,7 @@ class XiriDialogComponent {
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe({
             next: (result) => {
-                const ret = this.downloadService.download(result, 'Report', false);
+                const ret = this.downloadService.download(result, 'Report', tab);
                 if (!ret)
                     this.buttons.set([{
                             text: 'Download',
@@ -3194,6 +3213,7 @@ class XiriDialogComponent {
                 else
                     this.dialogRef.close(this.extra);
             }, error: (err) => {
+                tab?.close();
                 this.snackbar.error(err.error?.error || 'Unknown Error');
             }
         });
@@ -3217,7 +3237,10 @@ class XiriDialogComponent {
             this.startSend(button.data);
         }
         else if (button.action == 'download') {
-            this.download(this.type() == 'form' ? this.formValues : null);
+            const data = this.type() == 'form' ? this.formValues : null;
+            // Only the blob path needs a tab handle; data === null is an external link that
+            // opens its own tab. openTab() must run here, inside the click.
+            this.download(data, data !== null && button.target === '_blank' ? this.downloadService.openTab() : null);
         }
         else if (button.action == 'link') {
             this.router.navigate([button.url]).then();
@@ -3545,6 +3568,9 @@ class XiriButtonComponent {
     actionDownload() {
         const data = { ...this.filterData(), ...this.button().data };
         this.loading.set(true);
+        // Must happen before the request: openTab() needs the click's user activation.
+        // Without one (e.g. autoLoad) it returns null and the file is saved instead.
+        const tab = this.button().target === '_blank' ? this.downloadService.openTab() : null;
         this.dataService.postFileResponse(this._url() ?? '', data)
             .pipe(takeUntilDestroyed(this.destroyRef))
             .subscribe({
@@ -3554,9 +3580,11 @@ class XiriButtonComponent {
                 if (btn.filename != undefined)
                     filename = btn.filename;
                 else
-                    filename =
-                        (btn.text != undefined ? btn.text : 'Download') + '.csv';
-                this.downloadService.download(result, filename, false);
+                    // ponytail: no extension guess when the file is displayed — the
+                    // viewer would offer "Report.csv" for a PDF on save.
+                    filename = (btn.text != undefined ? btn.text : 'Download')
+                        + (tab ? '' : '.csv');
+                this.downloadService.download(result, filename, tab);
                 this.result.emit({
                     button: this.button(),
                     result: result,
@@ -3567,6 +3595,7 @@ class XiriButtonComponent {
             },
             error: (err) => {
                 console.log("xiri-button download error", err);
+                tab?.close();
                 this.result.emit({
                     button: this.button(),
                     result: null,
@@ -4906,12 +4935,18 @@ class XiriTableComponent {
                 });
                 break;
             }
-            case 'download':
+            case 'download': {
+                // Before the request — openTab() needs the click's user activation.
+                const tab = button.target === '_blank' ? this.downloadService.openTab() : null;
                 this.dataService.postFileResponse(button.url ?? '', payload).pipe(takeUntil(this.reloadAbort$)).subscribe({
-                    next: (result) => this.downloadService.download(result, button.filename || 'download.csv', false),
-                    error: (err) => this.snackbar.error(errorMessage(err) || 'Download Error'),
+                    next: (result) => this.downloadService.download(result, button.filename || 'download.csv', tab),
+                    error: (err) => {
+                        tab?.close();
+                        this.snackbar.error(errorMessage(err) || 'Download Error');
+                    },
                 });
                 break;
+            }
             default:
                 this.dataService.post(button.url ?? '', payload).pipe(takeUntil(this.reloadAbort$)).subscribe({
                     next: (result) => {
@@ -5003,11 +5038,14 @@ class XiriTableComponent {
         if (this.selection.isEmpty())
             return;
         const url = button.url ? button.url : '';
+        // Before the request — openTab() needs the click's user activation.
+        const tab = button.target === '_blank' ? this.downloadService.openTab() : null;
         this.dataService.postFileResponse(url, this.getSelectionIDs()).pipe(takeUntil(this.reloadAbort$)).subscribe({
             next: (result) => {
-                this.downloadService.download(result, 'download.csv', false);
+                this.downloadService.download(result, 'download.csv', tab);
             },
             error: (err) => {
+                tab?.close();
                 this.snackbar.error(errorMessage(err) || 'Download Error');
             }
         });