Some code left uncompiled with specific browserlist config (boolean())

[Shamilik]

Describe the bug

When using cover 75% in RU as browserlist config, part of code left uncompiled. But with cover 74% in RU everything is fine.

As a workaround I use import { boolean as boo } from 'yup';

Input code

import { withFormik } from 'formik';
import { object, boolean } from 'yup';

const test = {
  validationSchema: object({
    // working
    isAgent: boolean().required(),
  }),
  handleSubmit: () => {},
};

console.log(test);

export const DealRentModalWithFormik = withFormik({
  validationSchema: object({
    // skipped o_O
    isAgent: boolean().required(),
  }),
  handleSubmit: () => {},
})(() => <span />);

Config

{
  "jsc": {
    "parser": {
      "syntax": "typescript",
      "tsx": true
    },
    "loose": false,
    "minify": {
      "compress": false,
      "mangle": false
    }
  },
  "module": {
    "type": "commonjs"
  },
  "minify": false,
  "isModule": true,
  "env": {
    "targets": "cover 75% in RU"
  }
}

Playground link (or link to the minimal reproduction)

https://play.swc.rs/?version=1.11.13&code=H4sIAAAAAAAAA62QsU7DMBCG9zzFbbWlqNlbUgkJsVWV6NAROfE1OWL7jOO0oCjvjpu2wMjActJvf777fGQ9hwgjnCm2zxwsdTDBMbCFxXGOi3VGd4irN6xjDhWzQeW%2Byc%2FBJyyr2fURIqZSwpgBnJQhrSKx29ctWrW6dRCXS4CigDOHjlwzR%2BofG3RxdW8v5DLg%2B0ABtZB5Qqa5tsppg%2FuhspRYIaHcwDjl2XQzSG%2BXhhtx8ZDpDD9m%2B6vcEyrzkoZsWStz%2BPlz%2BWsB4m%2FqfUfeowZ%2B3f2LvhTX8ND7tNpiI9dfJ1TbvJ0BAAA%3D&config=H4sIAAAAAAAAA1WOSwrDMAxE9zmFEXTXbSn0Dt0UegDjKsEh%2FiA5oSHk7rGd2E130szoaZZGCOhZwUMscYyLl8RIdY8KzzbIb1QgzB5ZkfYBrsUNnKxAI2Zl3Q0YnGOMRisHxkMz2up2PqOVM56Q%2BT%2BYotJ2Q73fyc1BB%2BM%2BYzaPyqlWqhdpxtme4ZcsHysdND%2FLeSqdNbTTiSapw8A7cEIS99tFaCte78xt1g2wo0klNAEAAA%3D%3D

SWC Info output

No response

Expected behavior

boolean() should be compiled

Actual behavior

boolean() left uncompiled

Version

1.11.13

Additional context

No response

[kdy1]

Your reproduction seems to be wrong?

[Shamilik]

@kdy1 Seems fine 🤔

[kdy1]

Do you mean the member property name should be renamed?

[kdy1]

boolean is fine to be there if it’s a property of a member expression.

[Shamilik]

@kdy1 boolean() is import from yup and it should be transformed to (0, _yup.boolean)(), otherwise the result code is broken. Sorry, I will try to describe issues better next time :[

[kdy1]

Sorry, I was looking at the other boolean() call

[kdy1]

As someone requested on Discord, I'm writing a guideline to fix this issue.

Guide

(1 and 2 are optional)

1. Update the data of preset-env. You must update the @babel/compat-data and core-js-compat npm package.
2. Create a PR for 1.

These steps ensure the browserslist data is the latest, which may be required for the next step.

3. Run npx browserslist from your project to get the actual target browsers.
4. Add a test for the input using the target browsers from 4, to the ./crates/swc/tests/fixture/issues/10xxx/10266/input/
5. Modify .swcrc to have env.debug: true.

(See playground)

6. Run the test with cargo test --test projects 10266 -- --nocapture. It will give you the list of passes enabled by preset-env mode.
7. Check each pass to see if the pass has something to do with reserved keywords. You can search for reserved in the code of each pass.
8. Fix it to use the correct syntax context. See https://swc.rs/docs/contributing/es-commons/variable-management for the documentation for the syntax context.
9. Create a PR for it

Thank you in advance!

[sahilmob]

@kdy1 I followed the instructions in your comment; however, in swc_ecma_compat_es3/reserved_words, specifically in visit_mut_ident, both boolean instances in the playground have ctxt: #2, so it might be something other than other reserved words that causes the problem. Am I right?

[kdy1]

Yes, I think so.

But note that https://github.com/swc-project/swc/pull/10274 may have fixed this issue. You can run UPDATE cargo test --test projects 10266 to see if it's the case.

[sahilmob]

No, it didn't fix the issue.