Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

htmlInject might generate a wrong result #390

Open
oshmkufa2010 opened this issue Nov 21, 2024 · 1 comment
Open

htmlInject might generate a wrong result #390

oshmkufa2010 opened this issue Nov 21, 2024 · 1 comment

Comments

@oshmkufa2010
Copy link

  • jspm generator version: 2.4.1
  • input:
import { Generator } from '@jspm/generator';

const generator = new Generator({
  env: ['production', 'browser', 'module'],
});

(async function() {

console.log(await generator.htmlInject(`
  <!doctype html>
  <script type="module">
    import * as Material from "@mui/material";
    import * as react from "react";

    // Write main module code here, or as a separate file with a "src" attribute on the module script.
    console.log(Material, react);
  </script>
`, {
  trace: true,
  esModuleShims: true,
}));

})()
  • output:
  <!doctype html>
  <!-- Generated by @jspm/generator - https://github.com/jspm/generator -->
  <script async src="https://ga.jspm.io/npm:[email protected]/dist/es-module-shims.js" crossorigin="anonymous"></script>
  <script type="importmap">
  {
    "imports": {
      "@mui/material": "https://ga.jspm.io/npm:@mui/[email protected]/index.js",
      "react": "https://ga.jspm.io/npm:[email protected]/index.js"
    },
    "scopes": {
      "https://ga.jspm.io/": {
        "@babel/runtime/helpers/esm/assertThisInitialized": "https://ga.jspm.io/npm:@babel/[email protected]/helpers/esm/assertThisInitialized.js",
        "@babel/runtime/helpers/esm/extends": "https://ga.jspm.io/npm:@babel/[email protected]/helpers/esm/extends.js",
        "@babel/runtime/helpers/esm/inheritsLoose": "https://ga.jspm.io/npm:@babel/[email protected]/helpers/esm/inheritsLoose.js",
        "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose": "https://ga.jspm.io/npm:@babel/[email protected]/helpers/esm/objectWithoutPropertiesLoose.js",
        "@babel/runtime/helpers/extends": "https://ga.jspm.io/npm:@babel/[email protected]/helpers/esm/extends.js",
        "@emotion/cache": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-cache.browser.esm.js",
        "@emotion/hash": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-hash.esm.js",
        "@emotion/is-prop-valid": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-is-prop-valid.esm.js",
        "@emotion/memoize": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-memoize.esm.js",
        "@emotion/react": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-react.browser.esm.js",
        "@emotion/serialize": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-serialize.esm.js",
        "@emotion/sheet": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-sheet.esm.js",
        "@emotion/styled": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-styled.browser.esm.js",
        "@emotion/unitless": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-unitless.esm.js",
        "@emotion/use-insertion-effect-with-fallbacks": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-use-insertion-effect-with-fallbacks.browser.esm.js",
        "@emotion/utils": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-utils.browser.esm.js",
        "@emotion/weak-memoize": "https://ga.jspm.io/npm:@emotion/[email protected]/dist/emotion-weak-memoize.esm.js",
        "@mui/private-theming": "https://ga.jspm.io/npm:@mui/[email protected]/index.js",
        "@mui/styled-engine": "https://ga.jspm.io/npm:@mui/[email protected]/index.js",
        "@mui/system": "https://ga.jspm.io/npm:@mui/[email protected]/esm/index.js",
        "@mui/system/DefaultPropsProvider": "https://ga.jspm.io/npm:@mui/[email protected]/esm/DefaultPropsProvider/index.js",
        "@mui/system/Grid": "https://ga.jspm.io/npm:@mui/[email protected]/esm/Grid/index.js",
        "@mui/system/InitColorSchemeScript": "https://ga.jspm.io/npm:@mui/[email protected]/esm/InitColorSchemeScript/index.js",
        "@mui/system/RtlProvider": "https://ga.jspm.io/npm:@mui/[email protected]/esm/RtlProvider/index.js",
        "@mui/system/colorManipulator": "https://ga.jspm.io/npm:@mui/[email protected]/esm/colorManipulator/index.js",
        "@mui/system/createBreakpoints": "https://ga.jspm.io/npm:@mui/[email protected]/esm/createBreakpoints/index.js",
        "@mui/system/createStyled": "https://ga.jspm.io/npm:@mui/[email protected]/esm/createStyled/index.js",
        "@mui/system/createTheme": "https://ga.jspm.io/npm:@mui/[email protected]/esm/createTheme/index.js",
        "@mui/system/cssVars": "https://ga.jspm.io/npm:@mui/[email protected]/esm/cssVars/index.js",
        "@mui/system/spacing": "https://ga.jspm.io/npm:@mui/[email protected]/esm/spacing/index.js",
        "@mui/system/style": "https://ga.jspm.io/npm:@mui/[email protected]/esm/style/index.js",
        "@mui/system/styleFunctionSx": "https://ga.jspm.io/npm:@mui/[email protected]/esm/styleFunctionSx/index.js",
        "@mui/system/useMediaQuery": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useMediaQuery/index.js",
        "@mui/system/useThemeProps": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useThemeProps/index.js",
        "@mui/utils": "https://ga.jspm.io/npm:@mui/[email protected]/esm/index.js",
        "@mui/utils/ClassNameGenerator": "https://ga.jspm.io/npm:@mui/[email protected]/esm/ClassNameGenerator/index.js",
        "@mui/utils/HTMLElementType": "https://ga.jspm.io/npm:@mui/[email protected]/esm/HTMLElementType/index.js",
        "@mui/utils/appendOwnerState": "https://ga.jspm.io/npm:@mui/[email protected]/esm/appendOwnerState/index.js",
        "@mui/utils/capitalize": "https://ga.jspm.io/npm:@mui/[email protected]/esm/capitalize/index.js",
        "@mui/utils/chainPropTypes": "https://ga.jspm.io/npm:@mui/[email protected]/esm/chainPropTypes/index.js",
        "@mui/utils/clamp": "https://ga.jspm.io/npm:@mui/[email protected]/esm/clamp/index.js",
        "@mui/utils/composeClasses": "https://ga.jspm.io/npm:@mui/[email protected]/esm/composeClasses/index.js",
        "@mui/utils/createChainedFunction": "https://ga.jspm.io/npm:@mui/[email protected]/esm/createChainedFunction/index.js",
        "@mui/utils/debounce": "https://ga.jspm.io/npm:@mui/[email protected]/esm/debounce/index.js",
        "@mui/utils/deepmerge": "https://ga.jspm.io/npm:@mui/[email protected]/esm/deepmerge/index.js",
        "@mui/utils/deprecatedPropType": "https://ga.jspm.io/npm:@mui/[email protected]/esm/deprecatedPropType/index.js",
        "@mui/utils/elementAcceptingRef": "https://ga.jspm.io/npm:@mui/[email protected]/esm/elementAcceptingRef/index.js",
        "@mui/utils/elementTypeAcceptingRef": "https://ga.jspm.io/npm:@mui/[email protected]/esm/elementTypeAcceptingRef/index.js",
        "@mui/utils/exactProp": "https://ga.jspm.io/npm:@mui/[email protected]/esm/exactProp/index.js",
        "@mui/utils/extractEventHandlers": "https://ga.jspm.io/npm:@mui/[email protected]/esm/extractEventHandlers/index.js",
        "@mui/utils/formatMuiErrorMessage": "https://ga.jspm.io/npm:@mui/[email protected]/esm/formatMuiErrorMessage/index.js",
        "@mui/utils/generateUtilityClass": "https://ga.jspm.io/npm:@mui/[email protected]/esm/generateUtilityClass/index.js",
        "@mui/utils/generateUtilityClasses": "https://ga.jspm.io/npm:@mui/[email protected]/esm/generateUtilityClasses/index.js",
        "@mui/utils/getDisplayName": "https://ga.jspm.io/npm:@mui/[email protected]/esm/getDisplayName/index.js",
        "@mui/utils/getReactElementRef": "https://ga.jspm.io/npm:@mui/[email protected]/esm/getReactElementRef/index.js",
        "@mui/utils/getScrollbarSize": "https://ga.jspm.io/npm:@mui/[email protected]/esm/getScrollbarSize/index.js",
        "@mui/utils/getValidReactChildren": "https://ga.jspm.io/npm:@mui/[email protected]/esm/getValidReactChildren/index.js",
        "@mui/utils/integerPropType": "https://ga.jspm.io/npm:@mui/[email protected]/esm/integerPropType/index.js",
        "@mui/utils/isFocusVisible": "https://ga.jspm.io/npm:@mui/[email protected]/esm/isFocusVisible/index.js",
        "@mui/utils/isMuiElement": "https://ga.jspm.io/npm:@mui/[email protected]/esm/isMuiElement/index.js",
        "@mui/utils/mergeSlotProps": "https://ga.jspm.io/npm:@mui/[email protected]/esm/mergeSlotProps/index.js",
        "@mui/utils/ownerDocument": "https://ga.jspm.io/npm:@mui/[email protected]/esm/ownerDocument/index.js",
        "@mui/utils/ownerWindow": "https://ga.jspm.io/npm:@mui/[email protected]/esm/ownerWindow/index.js",
        "@mui/utils/refType": "https://ga.jspm.io/npm:@mui/[email protected]/esm/refType/index.js",
        "@mui/utils/requirePropFactory": "https://ga.jspm.io/npm:@mui/[email protected]/esm/requirePropFactory/index.js",
        "@mui/utils/resolveComponentProps": "https://ga.jspm.io/npm:@mui/[email protected]/esm/resolveComponentProps/index.js",
        "@mui/utils/resolveProps": "https://ga.jspm.io/npm:@mui/[email protected]/esm/resolveProps/index.js",
        "@mui/utils/setRef": "https://ga.jspm.io/npm:@mui/[email protected]/esm/setRef/index.js",
        "@mui/utils/unsupportedProp": "https://ga.jspm.io/npm:@mui/[email protected]/esm/unsupportedProp/index.js",
        "@mui/utils/useControlled": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useControlled/index.js",
        "@mui/utils/useEnhancedEffect": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useEnhancedEffect/index.js",
        "@mui/utils/useEventCallback": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useEventCallback/index.js",
        "@mui/utils/useForkRef": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useForkRef/index.js",
        "@mui/utils/useId": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useId/index.js",
        "@mui/utils/useLazyRef": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useLazyRef/index.js",
        "@mui/utils/usePreviousProps": "https://ga.jspm.io/npm:@mui/[email protected]/esm/usePreviousProps/index.js",
        "@mui/utils/useSlotProps": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useSlotProps/index.js",
        "@mui/utils/useTimeout": "https://ga.jspm.io/npm:@mui/[email protected]/esm/useTimeout/index.js",
        "@mui/utils/visuallyHidden": "https://ga.jspm.io/npm:@mui/[email protected]/esm/visuallyHidden/index.js",
        "@popperjs/core": "https://ga.jspm.io/npm:@popperjs/[email protected]/lib/index.js",
        "clsx": "https://ga.jspm.io/npm:[email protected]/dist/clsx.mjs",
        "dom-helpers/addClass": "https://ga.jspm.io/npm:[email protected]/esm/addClass.js",
        "dom-helpers/removeClass": "https://ga.jspm.io/npm:[email protected]/esm/removeClass.js",
        "hoist-non-react-statics": "https://ga.jspm.io/npm:[email protected]/dist/hoist-non-react-statics.cjs.js",
        "process": "https://ga.jspm.io/npm:@jspm/[email protected]/nodelibs/browser/process-production.js",
        "prop-types": "https://ga.jspm.io/npm:[email protected]/index.js",
        "react": "https://ga.jspm.io/npm:[email protected]/index.js",
        "react-dom": "https://ga.jspm.io/npm:[email protected]/index.js",
        "react-is": "https://ga.jspm.io/npm:[email protected]/index.js",
        "react-transition-group": "https://ga.jspm.io/npm:[email protected]/esm/index.js",
        "react/jsx-runtime": "https://ga.jspm.io/npm:[email protected]/jsx-runtime.js",
        "scheduler": "https://ga.jspm.io/npm:[email protected]/index.js",
        "stylis": "https://ga.jspm.io/npm:[email protected]/index.js"
      },
      "https://ga.jspm.io/npm:[email protected]/": {
        "react-is": "https://ga.jspm.io/npm:[email protected]/index.js"
      },
      "https://ga.jspm.io/npm:[email protected]/": {
        "react-dom": "https://ga.jspm.io/npm:[email protected]/index.js"
      }
    }
  }
  </script>
  <script type="module">
    import * as Material from "@mui/material";
    import * as react from "react";

    // Write main module code here, or as a separate file with a "src" attribute on the module script.
    console.log(Material, react);
  </script>

notice "react": "https://ga.jspm.io/npm:[email protected]/index.js" which will cause an error: Uncaught TypeError: Cannot read properties of undefined (reading 'ReactCurrentOwner')
@guybedford
Copy link
Member

This seems to be working correctly now - see the sandbox example at https://jspm.org/sandbox#H4sIAAAAAAAAA7WaW1fbOhbH3/spdDIvM7Nqm9DL9NDQFQ6Eli7S4TTQrnlU7B0ssC2PJAdCV7/7bMk2xI6xbPfMA5dEe/9/W9K2btbkt4D7apMCCVUcfXgxKf8ADT68IGQSg6LED6mQoA5HmVo570amQDEVwYerxPwNJl7 dEloTEcjtYM7lIu1Ij4PFGQoMQdC1R4GMCa eCYDy8JS5hiNHKkTyM4HCNg4uURTJY82BjV3xwH/xDyeXExJx8hAUEVF Qs1vpkTlNTOguYIldfzw wPiqVB553XZq6NzKNXca9v13tfwn/8/EPdiL3xGbx8HlxNQ79 bV6CC4vLhf3n8/9dP7waXa393Dxfb5/xBe34/l5MrtTX/582DuZHx2dnJ1 nM3WR0fIdBwdHplIX7BUEd2WhyNmooppatrqhwmt FKODoov8KtpnDEvpgoEVh8LRo9R08dwkzQ qNhN37qv3D2PJQHco9XoZakmgPqqRcWUT8e/u3vb7sb7Zy4ykj5PoRJig9ZWsa7Dki4h8kSGqRAD9luUgpAeyNijUoJQlyGTZ3kPswcI2qpZkZr y91/i5FaFbcboT0guMckDOQvhVBodIeyJMR U/Kccwm/hK4odQ AL2/AV9 ZCnmmLgT2sFAM/oJ42oQ7hvf/6xCIuWI88Xzqh63VrBhOx2N3/BoJAZPKK4ocU QuBb/D9HMR hwspDLswtJ20z33d3e/CtLft kz6aTYzs4aM7/1SWp0mI5x5BhXiRWDNnSM/ DT1gVamJoK1lqyKGoD2YaxqmFzh5miLh0mzZDasV6PxqYhX1WRj4WtuBCgU92MIWJ2amYKWhFqE7WPslXL5gbMy7q0YJbomV 2PsN1W8yM8V4dWRa2wiQ4LNFzgPaA1QrHH1xFqNBZ0ShaUv 2Wxx2GWz7/Z0I7W6dWkyxqFuY2tAkQW2YMAVdUHdAb50eT 62PXbSTlpslzdx9TolFWyNSxVHhRCz5Nq2rKmZP7e6KdXzxHQguWZJa5V2jK3KG6kgtkoaq0Irn5Rb9bwTWNEsMtOjxF9rFoDoDWkSsZI/ivY5opGknazKevF1zCMuFjgvxrAwa9/eqEYVK/urigY345avlePryOY0YWkW6f1Db1hdwE7EWUvBH/j7NuUsUa1jRDOyrtCRubDOGS243Lkj6VL39ECQ8bVzpPyG29X jNzPqi9T6ncY1nb0Cz 7vm7O/uraq5v2aZb4ejBf3A jPPlbeThhziFg9M8MxKY3reLdhWUSxIyRQ1hP3s zrFP3o1GXGcIYescR7mq/0BgeTzX6AnYVbMxPl/PzWYT1TdTlJrWmWx1Yc7fRaJriDu3fdxjcQuGD3BdX97fxfJoyZV3VN5GePK2MkLJEZ4tugN4pUfW2siIap70R2smqzOMUN smgQbUouJtZZlB/FjXHIJyEOmNbBKxkQNYcjTtnQ2ln10f0hjE9QBA4WgnpAJ8rHlQJk1/VF3BxoT8AT/yfUgVzlxfYdUX2iDRkaoD/AvIdRkr/Z76ZpXdm1c62glKoOlsjdF9okkQgX2tsgvb1bBxV1zEVM0zNhMCl6W4z6b987VRxEYuTuDhCj8xtTGjRV9wk8YQbv8xrlnFzlYnTKYR3ehpuT9z27sD66s 7iom5AEPy65CByZu17g 9BCLAfNs3b8D75s oDRhHocsCgT0njsaRWxk3EXBNYihw27N3UqTp9zP5Dcm2dK C9iBVbztLP0g513en/Tka OYCW4RcdVpZV4nVb1tLK7XiCfYCEMqVXHuRPqORvxuECd3tVEErIZkXeFmV/9vxoTZ85ziI8Hte7RdUF3BzpQ8WsOxXjom2M6DkqJRpCP5V4CdOBKGjMG5l007S2SW6tfI TKuL6TmbqXh2p4nSo/T9tOhHda2cwfSLAkprrWDmTlWH0CrCnQh6vXTcXFyPwS47d Bd8rF7YDMePLswDgb0k9nXfrnnD5shkVfeHZgXAhYM57JQc9o3b8Db/CstO3bgXPJYuDZkKQuPG2MNZMZJuLmEwuC/gujqnczK VpCuJGHxmI1vmoYjjdd8dj950XsWWjrB/JtlNIXawlypfW rMbVyUCHjvldQAaBLbtxZb59I15xWdOmApH93ltATFfwzD5Ld8aIeRYLycpX1k7UlHF/DbCMx7TV9idxWvCZ0xc/6aOTwX3Le9u9YfHvsT6JDwA7E7pFa8fvUJDXyMIMnMeswtJHWU5Jnsymo7fuO wx5vyJa8PNrLtmpO22bnqtCPE2iIqTewyuBtPJDMvSK8Fz9qm5WaH6Wv3tfvm2cNi4 TdyHunuAbT9ZLXlktNUp/kt9Y N8DA9ncuiz1eF2u HmZP0uoFsl5d8dYdv9rOjTKgF Vv/TPx8tt45uJg8e dWW 7RbKSQ/IDkvXBj58/t42Li4ZktiBzTOYIyCJksST51T0S01SSlEebFYsiWVz9K2/ UblJfCKFf/hcLUA6sVF1pFadjvUliPI6TrVMV43gBllKLtg1Sw5HFBtzE PcNvpQj7hy9TBXMfcOSRn3PzE4Mi uD5KV4HH96uH7HXPT5IVtfiPnfY4jxPPId8EUYHuwhORA4uOwQEIQ8JJwoQUokZBSfXRCsLmA6HsS OUIW2hEqFKCLTMs4wlRIZQqeVVcg/F5gotucCN /fcy Jd5XP94X nliZdfE514 fXV/wFtYshS1ioAAA==

Can you try this again and let me know if you're still seeing the issue?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@guybedford @oshmkufa2010