Skip to content

refactor(excel-export): switch to explicit fflate/browser entry#17122

Open
damyanpetev wants to merge 1 commit intomasterfrom
dpetev/fflate-import
Open

refactor(excel-export): switch to explicit fflate/browser entry#17122
damyanpetev wants to merge 1 commit intomasterfrom
dpetev/fflate-import

Conversation

@damyanpetev
Copy link
Copy Markdown
Member

The import from fflate when bundled by vitest with Playwright in Angular project causes this issue:
image
regardless of component, as long as igniteui-angular is present, because this is bunlded like so:
image

That's because by default vitest will include the node condition and browser when browser mode is on, but fflate exposes that as import instead so this is bundled:
image
Note: Can't seem to find a definitive standard on these conditions, this could be resolvable by a fix in the package too.

Alternative:

Tested with the following vitest config:

export default defineConfig({
  // https://vitest.dev/guide/common-errors.html#custom-package-conditions-are-not-resolved
  ssr: {
    resolve: {
      conditions: ['browser', 'import', 'default'],
    },
  },
  resolve: {
    conditions: ['browser', 'import', 'default'],
  },
  test: {
    browser: {
      provider: playwright(),
      enabled: true,
      // at least one instance is required
      instances: [
        { browser: 'chromium' },
      ],
    },
  }
});

But none of those worked, possibly not passed down by the angular process.
The only thing that did work was the alias:

export default defineConfig({
  resolve: {
    alias: [
      { find: /^fflate$/, replacement: 'fflate/browser' },
    ],
  },
  //...

Which might need to be documented if this PR doesn't work out - this needs to be evaluated for SSR scenarios.

Additional information (check all that apply):

  • Bug fix
  • New functionality
  • Documentation
  • Demos
  • CI/CD

Checklist:

  • All relevant tags have been applied to this PR
  • This PR includes unit tests covering all the new code (test guidelines)
  • This PR includes API docs for newly added methods/properties (api docs guidelines)
  • This PR includes feature/README.MD updates for the feature docs
  • This PR includes general feature table updates in the root README.MD
  • This PR includes CHANGELOG.MD updates for newly added functionality
  • This PR contains breaking changes
  • This PR includes ng update migrations for the breaking changes (migrations guidelines)
  • This PR includes behavioral changes and the feature specification has been updated with them

@damyanpetev damyanpetev marked this pull request as ready for review April 2, 2026 16:37
Copilot AI review requested due to automatic review settings April 2, 2026 16:37
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses a Vitest (Playwright browser mode) bundling issue by forcing the Excel export implementation to use fflate’s explicit browser entrypoint.

Changes:

  • Switch zip import to fflate/browser in the Excel exporter service.
  • Switch strToU8 import to fflate/browser in Excel file generation helpers.

Reviewed changes

Copilot reviewed 2 out of 2 changed files in this pull request and generated 2 comments.

File Description
projects/igniteui-angular/grids/core/src/services/excel/excel-exporter.ts Uses fflate/browser for zipping the generated Excel file structure to avoid Vitest selecting the Node entry.
projects/igniteui-angular/grids/core/src/services/excel/excel-files.ts Uses fflate/browser for string-to-Uint8Array conversion when generating XLSX XML payloads.

@@ -1,4 +1,4 @@
import { zip } from 'fflate';
import { zip } from 'fflate/browser';
Copy link

Copilot AI Apr 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Importing from fflate/browser hard-codes the browser entry at module load time. Since IgxExcelExporterService is part of the public grids/core surface (and can be pulled into SSR/server bundles indirectly), this can cause SSR/runtime failures if fflate/browser touches browser globals during evaluation. Consider lazy-loading fflate/browser only when an export is triggered (similar to the dynamic import('jspdf') used in pdf-exporter.ts) or introducing an environment-aware wrapper that selects the appropriate entry for browser vs server builds.

Suggested change
import { zip } from 'fflate/browser';
import { zip } from 'fflate';

Copilot uses AI. Check for mistakes.
import { WorksheetData } from './worksheet-data';

import { strToU8 } from 'fflate';
import { strToU8 } from 'fflate/browser';
Copy link

Copilot AI Apr 2, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same concern as in excel-exporter.ts: importing strToU8 from fflate/browser forces the browser build to be evaluated whenever this module is loaded. If this code ends up in an SSR/server bundle, and fflate/browser relies on browser-only globals at module init, it can break SSR even when Excel export isn’t used. If feasible, gate loading of the browser entry behind an on-demand (cached) dynamic import, or provide a wrapper that can resolve to a server-safe implementation when running under SSR.

Suggested change
import { strToU8 } from 'fflate/browser';
import { strToU8 } from 'fflate';

Copilot uses AI. Check for mistakes.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

version: 21.2.x ❌ status: awaiting-test PRs awaiting manual verification

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants