fix: time formatting bun2719

[BrianJiang2021]

Jira: BUN-2719

What/Why?

time formatting

Rollout/Rollback

undo pr

Testing

[SE-Graham]

@BrianJiang2021

I can't seem to get B2B to run when it includes this PR.

It results in following error in the browser console

mui-B9wxrMZb.js:17 Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'exports') at mui-B9wxrMZb.js:17:4146 at Nc (mui-B9wxrMZb.js:17:4201) at eReact-CjZuucTw.js:1:3858

[BrianJiang2021]

Hi @SE-Graham

Because I haven't reproduced the problem you mentioned. So can you provide a screenshot? Or a video of the whole process? This will help me understand what happened when the problem occurred.

If you are running locally, you may try to reinstall the dependency package to see if it can solve the problem.

[SE-Graham]

Hi @BrianJiang2021

I've started fresh using the main branch.

Video of build process and screenshot of error in chrome.

Not shown but I have updated the .env

https://swimming.box.com/shared/static/l6on6t8giip6jkr0wvpin8soi00fuv31.mov

[BrianJiang2021]

Hi @SE-Graham After the build is completed, what operations are performed? Can you record the entire process from running the project to the page error? If so, can you provide the .env configuration?

If you are running at http://localhost:3xxx/, there may be cross-domain issues or other issues The way we run locally has changed now. For details, you can refer to https://github.com/bigcommerce/b2b-buyer-portal?tab=readme-ov-file#-local-development and https://github.com/bigcommerce/b2b-buyer-portal?tab=readme-ov-file#running-project-locally

Below is the video I recorded. I reinstalled the dependency package in the main branch and successfully built it. Then I configured our test store according to the tutorial in git README. As you can see, the project is running normally and there is no problem you reported.

https://github.com/user-attachments/assets/bd19ba29-9fb7-440b-a6ff-a25d304ab849

[SE-Graham]

Hi @BrianJiang2021

Thank you help on this it's a strange issue. I'm using a Mac M1 Mini running node 18.18.0, Yarn 1.22.22 and npm v9.8.1.

I've got a feeling the issue might have started when node got bumped from 18.17.0 to 18.18.0 but can't be 100% sure. @typescript-eslint/eslint-plugin@7.9.0: The engine "node" is incompatible with this module. Expected version "^18.18.0 || >=20.0.0". Got "18.17.0"

This is being deployed to our BC Sandbox store, this use to work without issues. The files are copied over to our Cloudflare R2 bucket and the footer script is updated with the new URLs.

The error you see appears when loading the home page or any other page, for example instead of getting the b2b login you get the BC login page.

<script>
  window.b3CheckoutConfig = {
    routes: {
      dashboard: '/account.php?action=order_status',
    },
  }
  window.B3 = {
    setting: {
      store_hash: "{{settings.store_hash}}",
      channel_id: 1,
      platform: 'bigcommerce',
      b2b_url: 'https://api-b2b.bigcommerce.com',
      captcha_setkey: '6LdGN_sgAAAAAGYFg1lmVoakQ8QXxbhWqZ1GpYaJ',
    },
    'dom.checkoutRegisterParentElement': '#checkout-app',
    'dom.registerElement':
      '[href^="/login.php"], #checkout-customer-login, [href="/login.php"] .navUser-item-loginLabel, #checkout-customer-returning .form-legend-container [href="#"]',
    'dom.openB3Checkout': 'checkout-customer-continue',
    before_login_goto_page: '/account.php?action=order_status',
    checkout_super_clear_session: 'true',
    'dom.navUserLoginElement': '.navUser-item.navUser-item--account',
  }
</script>
<script type="module" crossorigin src="https://b2b-buyer-portal.swimming.org/staging/v1.0.41/index.1HrXa0Ye.js"></script>
<script nomodule crossorigin src="https://b2b-buyer-portal.swimming.org/staging/v1.0.41/polyfills-legacy.CXJzAxq-.js"></script>
<script nomodule crossorigin src="https://b2b-buyer-portal.swimming.org/staging/v1.0.41/index-legacy.DyTIk_DM.js"></script>

# URL of the B2B API, if doing local development, this should be the URL of the local B2B API with its own port
VITE_B2B_URL=https://api-b2b.bigcommerce.com

# URL of the B2B Socket - this should be the same as the B2B API URL
VITE_B2B_SOCKET_URL=https://api-b2b.bigcommerce.com

# URL of the B2B Translation Service - if doing local development, try with localhost:5000 or check the service URL
VITE_TRANSLATION_SERVICE_URL=https://api-b2b.bigcommerce.com

# Captcha Site Key for the storefront
VITE_CATPCHA_SETKEY="6LdGN_sgAAAAAGYFg1lmVoakQ8QXxbhWqZ1GpYaJ"

# Client ID issued by B2B Edition for the storefront
VITE_B2B_CLIENT_ID="dl7c39mdpul6hyc489yk0vzxl6jesyx"

# Set this to TRUE to debug in your default storefront
VITE_LOCAL_DEBUG=FALSE

# URL where the GraphQL is hosted, usually the same one as B2B_URL_API. If the GraphQL API is hosted locally, set this to the local URL
VITE_LOCAL_GRAPHQL_ORIGIN="https://api-b2b.bigcommerce.com"

# For custom host, set this to the absolute path where will be hosted the generated assets after your run `yarn build`
VITE_ASSETS_ABSOLUTE_PATH="https://b2b-buyer-portal.swimming.org/staging/v1.0.41/assets/"

Previous Build

If I revert the footer to a previous build everything works fine.

<script>
  window.b3CheckoutConfig = {
    routes: {
      dashboard: '/account.php?action=order_status',
    },
  }
  window.B3 = {
    setting: {
      store_hash: "{{settings.store_hash}}",
      channel_id: 1,
      platform: 'bigcommerce',
      b2b_url: 'https://api-b2b.bigcommerce.com',
      captcha_setkey: '6LdGN_sgAAAAAGYFg1lmVoakQ8QXxbhWqZ1GpYaJ',
    },
    'dom.checkoutRegisterParentElement': '#checkout-app',
    'dom.registerElement':
      '[href^="/login.php"], #checkout-customer-login, [href="/login.php"] .navUser-item-loginLabel, #checkout-customer-returning .form-legend-container [href="#"]',
    'dom.openB3Checkout': 'checkout-customer-continue',
    before_login_goto_page: '/account.php?action=order_status',
    checkout_super_clear_session: 'true',
    'dom.navUserLoginElement': '.navUser-item.navUser-item--account',
  }
</script>
<script type="module" crossorigin src="https://b2b-buyer-portal.swimming.org/staging/v1.0.27/index.DBdZAyf5.js"></script>
<script nomodule crossorigin src="https://b2b-buyer-portal.swimming.org/staging/v1.0.27/polyfills-legacy.CXJzAxq-.js"></script>
<script nomodule crossorigin src="https://b2b-buyer-portal.swimming.org/staging/v1.0.27/index-legacy.D_tw_MmD.js"></script>

However if I run it as per https://github.com/bigcommerce/b2b-buyer-portal?tab=readme-ov-file#running-project-locally it runs without issue.

It's only the deployed build that seems to have the issue.

[BrianJiang2021]

Hi, @SE-Graham

you can try to modify the node to version 20.17.0 and redeploy it

[SE-Graham]

Hi, @BrianJiang2021

I've tried 20.17.0 and still getting the same error when deployed.

If you deploy it and don't run it locally does it work for you?

mui-B9wxrMZb.js:17 Uncaught (in promise) TypeError: Cannot set properties of undefined (setting 'exports')
    at mui-B9wxrMZb.js:17:4146
    at Nc (mui-B9wxrMZb.js:17:4201)
    at eReact-CjZuucTw.js:1:3858
(anonymous) @ mui-B9wxrMZb.js:17
Nc @ mui-B9wxrMZb.js:17
(anonymous) @ eReact-CjZuucTw.js:1
requestIdleCallback
(anonymous) @ index.CMJRwx-K.js:2

[BrianJiang2021]

Hi, @SE-Graham

I built it through local yarn, started dist with http-server, and reproduced this problem.

Please try modifying the following: packages==> tsconfig ==> vite.json ==> Modify esModuleInterop to true

Hope it helps you