Pull request checklist

Please check if your PR fulfills the following requirements:

• Tests for the changes have been added (for bug fixes / features)
• Docs have been reviewed and added / updated if needed (for bug fixes / features)
• Build (npm run build) was run locally and any changes were pushed
• Unit tests (npm test) were run locally and passed
• E2E Tests (npm run test.karma.prod) were run locally and passed
• Prettier (npm run prettier) was run locally and passed

Pull request type

Please check the type of change your PR introduces:

• Bugfix
• Feature
• Refactoring (no functional changes, no api changes)
• Build related changes
• Documentation content changes
• Other (please describe):

What is the current behavior?

Sourcemaps with minification produce inconsistent results across browsers. In particular, I was looking at Firefox
GitHub Issue Number: N/A

What is the new behavior?

this commit introduces a new type, OptimizeJsResult, to be used to name
the shape of the object that is returned by various methods that are
used to minify a user's JavaScript. using this type in the return
signature of methods + in the declaration of objects allows us to
eliminate unnessary type assertions on the individual fields of said
objects.

• add JSDoc to minification to the functions that were investigated as a
  part of this effort.

account for minification with sourcemaps

• sourcemaps in some regard are at odds with attempting to minize and
  compress our JavaScript files. Ideally there's no fidelity lost when
  compressing JS, but in some cases, we get inconsistent behaviors across
  browsers when we have both 'sourcemap' and 'compress' enabled in our
  terser configuration.

• after diffing through the terser source/docs, I think our best route
  forward for now is to simply disable the compress step. I took a sample
  Stencil app and did a diff of the output where in one scenario we
  didn't set compress to undefined, and one where we did set it to
  undefined. other than the sourcemaps themselves, the differences were
  rather minimal, and I believe this shouldn't have a large impact on the
  output

Does this introduce a breaking change?

• Yes
• No

Testing

I spun up a basic Stencil component library with npm init stencil. Run npm i in the created project.

Navigate to src/utils/utils.ts and update the file as such:

export function format(first: string, middle: string, last: string): string {
  const str =  `the one and only` + 
      (first || '') + 
      (middle ? ` ${middle}` : '') + 
      (last ? ` ${last}` : '');
  return 'why it is ' + str; 
}

Update your stencil.config.ts, setting:

  minifyJs: true,
  sourceMap: true,

Checkout the rwaskiewicz-rebase-again-sourcemaps branch, which allows for sourcemaps to be used. Build stencil with npm ci && npm run build && npm pack and install the tarball in your component library

Finally start the dev server with npm start.

Observe the following breakpoint behaviors in Firefox, Safari, Edge and Chrom (clockwise starting in the left hand corner).

Note that above we:

• cannot put breakpoints on lines 2 or 6, the start of statements in any browser
• safari's mappings look a little funky
• we don't have scopes properly supplied, str is not consistently reported in the debugger

Pull down this branch, npm run build && npm pack it, then install the tarball in your component library.
npm start again, and observe nicer breakpoint behavior remediating the issues above

Other information