soranoo / next-css-obfuscator

A package deeply inspired by PostCSS-Obfuscator but for Next.js.
https://next-css-obfuscator.vercel.app
MIT License
71 stars 3 forks source link

[Non-AST Based] Failed to capture the correct content if there is no "{" and "}" wrapped outside the `.jsx` obfuscation marker. #41

Open soranoo opened 3 months ago

soranoo commented 3 months ago

[!NOTE]\ This only affects the non-AST based obfuscation (i.e. enableJsAst: false) with enableMarkers: false

Type

Checklist

  1. [x] Updated the package to the latest version
  2. [x] Read all documentation
  3. [x] No related issue
  4. [x] Meaningful issue title

Environment

Describe the bug Failed to capture the correct content if there is no "{" and "}" wrapped outside the .jsx obfuscation marker.

To Reproduce Steps to reproduce the behavior:

import fs from "fs";
import path from "path";
import { obfuscateJs } from "./src/handlers/js";

const jsonDataPath = path.join(__dirname, "css-obfuscator");
const jsonData = {};
fs.readdirSync(jsonDataPath).forEach((file: string) => {
    const filePath = path.join(jsonDataPath, file);
    const fileData = JSON.parse(fs.readFileSync(filePath, "utf-8"));
    Object.assign(jsonData, fileData);
});

const obsJs = obfuscateJs(`b = ({ className: s = "", children: t, ...r }) => e.jsx(l, { ...r, className: "block w-full px-4 py-2 text-start text-sm leading-5 text-gray-700 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 transition duration-150 ease-in-out " + s, children: t, }); function v({ active: s = !1, className: t = "", children: r, ...n }) { return e.jsx(l, { ...n, className: "block w-full px-4 py-2 text-start text-sm" + (s ? "leading-5" : "text-gray-700") + t, children: r, }); }`
, ".jsx", jsonData, "fake_path", [], false)
console.log(obsJs);

Expected behavior Obfuscate all classNames.

Screenshots image

Code

// Failed
b = ({ className: s = "", children: t, ...r }) =>
    e.jsx(l, {
        ...r,
        className:
            "block w-full px-4 py-2 text-start text-sm leading-5 text-gray-700 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 transition duration-150 ease-in-out " +
            s,
        children: t,
    });

// Success
function v({ active: s = !1, className: t = "", children: r, ...n }) {
  return e.jsx(l, {
      ...n,
      className:
          "ca1or cctlf ccn3e cfg9y cevl3 cevd7 c7vyf c8r2h cdon0 ce1sz cfuim carw5 " +
          (s
              ? "ca4kf cf4p6 cejum "
              : "ceesc ccfge ca6vp caers cb5z5 ccuy9 ") +
          t,
      children: r,
  });
}

Config

module.exports = {
  enable: true,
  mode: "random", // random | simplify | simplify-seedable
  refreshClassConversionJson: false, // recommended set to true if not in production
  allowExtensions: [".jsx", ".tsx", ".js", ".ts", ".html", ".rsc"],
  buildFolderPath: "public/build/assets", // Build folder of your project.
};

Solution

  1. Set enableJsAst: true in the config.