getClientInfo getBrowserType function does not identify Microsoft Edge

[gardin-davidl]

Before opening, please confirm:

• I have searched for duplicate or closed issues and discussions.
• I have read the guide for submitting bug reports.
• I have done my best to include a minimal, self-contained set of instructions for consistently reproducing the issue.

JavaScript Framework

Not applicable

Amplify APIs

Analytics

Amplify Categories

analytics

Environment information

  System:
    OS: Linux 5.15 Ubuntu 20.04.6 LTS (Focal Fossa)
    CPU: (16) x64 11th Gen Intel(R) Core(TM) i7-11800H @ 2.30GHz
    Memory: 5.11 GB / 7.59 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
    npm: 8.11.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
  Browsers:
    Chrome: 119.0.6045.199
    Firefox: 120.0
  npmPackages:
    @ampproject/toolbox-optimizer:  undefined ()
    @aws-amplify/core: ^5.8.4 => 5.8.6 
    @aws-amplify/core/internals/aws-client-utils:  undefined ()
    @aws-amplify/core/internals/aws-client-utils/composers:  undefined ()
    @aws-amplify/core/internals/aws-clients/pinpoint:  undefined ()
    @aws-amplify/geo: ^2.3.5 => 2.3.6 
    @aws-amplify/ui-react: ^5.0.0 => 5.3.0 
    @aws-amplify/ui-react-geo: ^1.0.2 => 1.0.2 
    @aws-amplify/ui-react-internal:  undefined ()
    @aws-amplify/ui-react-storage: ^2.3.0 => 2.3.0 
    @babel/core:  undefined ()
    @babel/runtime:  7.15.4 
    @cloudscape-design/collection-hooks: ^1.0.3 => 1.0.23 
    @cloudscape-design/components: ^3.0.244 => 3.0.392 
    @cloudscape-design/global-styles: ^1.0.1 => 1.0.12 
    @cypress/angular:  0.0.0-development 
    @cypress/code-coverage: ^3.10.7 => 3.10.7 
    @cypress/mount-utils:  0.0.0-development 
    @cypress/react:  0.0.0-development 
    @cypress/react18:  0.0.0-development 
    @cypress/svelte:  0.0.0-development 
    @cypress/vue:  0.0.0-development 
    @cypress/vue2:  0.0.0-development 
    @fontsource/inter: ^4.5.7 => 4.5.7 
    @googlemaps/react-wrapper: ^1.1.35 => 1.1.35 
    @hapi/accept:  undefined ()
    @napi-rs/triples:  undefined ()
    @next/react-dev-overlay:  undefined ()
    @next/react-refresh-utils:  12.1.6 
    @peculiar/webcrypto:  undefined ()
    @testing-library/cypress: ^9.0.0 => 9.0.0 
    @testing-library/jest-dom: ^5.16.4 => 5.16.4 
    @testing-library/react: ^13.2.0 => 13.2.0 
    @testing-library/user-event: ^14.4.3 => 14.4.3 
    @vercel/nft:  undefined ()
    abort-controller:  undefined ()
    acorn:  undefined ()
    amphtml-validator:  undefined ()
    arg:  undefined ()
    assert:  undefined ()
    async-retry:  undefined ()
    async-sema:  undefined ()
    aws-amplify: ^5.0.0 => 5.3.12 
    babel-jest: ^28.1.0 => 28.1.1 
    babel-packages:  undefined ()
    babel-plugin-istanbul: ^6.1.1 => 6.1.1 
    browserify-zlib:  undefined ()
    browserslist:  undefined ()
    buffer:  undefined ()
    bytes:  undefined ()
    chalk:  undefined ()
    ci-info:  undefined ()
    cli-select:  undefined ()
    comment-json:  undefined ()
    compression:  undefined ()
    conf:  undefined ()
    constants-browserify:  undefined ()
    content-disposition:  undefined ()
    content-type:  undefined ()
    cookie:  undefined ()
    cross-spawn:  undefined ()
    crypto-browserify:  undefined ()
    cssnano-simple:  undefined ()
    cypress: ^12.17.4 => 12.17.4 
    d3: ^7.4.4 => 7.4.4 
    debug:  undefined ()
    devalue:  undefined ()
    domain-browser:  undefined ()
    eslint: 8.14.0 => 8.14.0 
    eslint-config-next: 12.1.6 => 12.1.6 
    etag:  undefined ()
    events:  undefined ()
    find-cache-dir:  undefined ()
    find-up:  undefined ()
    formdata-node:  undefined ()
    framer-motion: ^6.3.11 => 6.3.11 
    fresh:  undefined ()
    get-orientation:  undefined ()
    glob:  undefined ()
    gzip-size:  undefined ()
    http-proxy:  undefined ()
    https-browserify:  undefined ()
    icss-utils:  undefined ()
    identity-obj-proxy: ^3.0.0 => 3.0.0 
    ignore-loader:  undefined ()
    image-size:  undefined ()
    immer: ^10.0.3 => 10.0.3 (9.0.6)
    is-animated:  undefined ()
    is-docker:  undefined ()
    is-wsl:  undefined ()
    jest: ^28.1.0 => 28.1.0 
    jest-canvas-mock: ^2.4.0 => 2.4.0 
    jest-environment-jsdom: ^28.1.0 => 28.1.0 
    jest-worker:  undefined ()
    json5:  undefined ()
    jsonwebtoken:  undefined ()
    loader-utils:  undefined ()
    lodash.curry:  undefined ()
    lru-cache:  undefined ()
    micromatch:  undefined ()
    microphone-stream: ^6.0.1 => 6.0.1 
    mini-css-extract-plugin:  undefined ()
    nanoid:  undefined ()
    native-url:  undefined ()
    neo-async:  undefined ()
    next: 12.1.6 => 12.1.6 
    next-compose-plugins: ^2.2.1 => 2.2.1 
    next-transpile-modules: ^9.0.0 => 9.0.0 
    node-fetch:  undefined ()
    node-html-parser:  undefined ()
    ora:  undefined ()
    os-browserify:  undefined ()
    p-limit:  undefined ()
    path-browserify:  undefined ()
    postcss-flexbugs-fixes:  undefined ()
    postcss-modules-extract-imports:  undefined ()
    postcss-modules-local-by-default:  undefined ()
    postcss-modules-scope:  undefined ()
    postcss-modules-values:  undefined ()
    postcss-preset-env:  undefined ()
    postcss-safe-parser:  undefined ()
    postcss-scss:  undefined ()
    postcss-value-parser:  undefined ()
    process:  undefined ()
    prop-types: ^15.8.1 => 15.8.1 
    punycode:  undefined ()
    querystring-es3:  undefined ()
    raw-body:  undefined ()
    react: 18.1.0 => 18.1.0 (18.2.0, 17.0.2)
    react-calendar-timeline: ^0.28.0 => 0.28.0 
    react-device-detect: ^2.2.3 => 2.2.3 
    react-dnd: ^16.0.1 => 16.0.1 
    react-dnd-html5-backend: ^16.0.1 => 16.0.1 
    react-dom: 18.1.0 => 18.1.0 
    react-icons: ^4.3.1 => 4.3.1 
    react-is:  17.0.2 
    react-refresh:  0.12.0 
    react-responsive-carousel: ^3.2.23 => 3.2.23 
    react-responsive-modal: ^6.4.1 => 6.4.1 
    react-selectable: ^2.1.1 => 2.1.1 
    react-server-dom-webpack:  undefined ()
    react-slider: ^2.0.4 => 2.0.4 
    react-test-renderer: ^18.1.0 => 18.1.0 
    react-tooltip: ^5.21.1 => 5.21.1 
    recharts: ^2.1.12 => 2.7.2 
    regenerator-runtime:  0.13.4 
    sass-loader:  undefined ()
    schema-utils:  undefined ()
    semver:  undefined ()
    send:  undefined ()
    setimmediate:  undefined ()
    short-uuid: ^3.1.1 => 3.1.1 
    simpleheat: ^0.4.0 => 0.4.0 
    smartlook-client: ^8.2.0 => 8.2.0 
    source-map:  undefined ()
    start-server-and-test: ^1.14.0 => 1.14.0 
    stream-browserify:  undefined ()
    stream-http:  undefined ()
    string-hash:  undefined ()
    string_decoder:  undefined ()
    strip-ansi:  undefined ()
    terser:  undefined ()
    text-table:  undefined ()
    timers-browserify:  undefined ()
    tty-browserify:  undefined ()
    ua-parser-js:  undefined ()
    unistore:  undefined ()
    use-local-storage-state: ^17.0.1 => 17.0.1 
    use-subscription:  undefined ()
    util:  undefined ()
    uuid:  undefined ()
    vm-browserify:  undefined ()
    watchpack:  undefined ()
    web-streams-polyfill:  undefined ()
    web-vitals:  undefined ()
    webpack:  undefined ()
    webpack-sources:  undefined ()
    ws:  undefined ()
    zustand: ^4.4.6 => 4.4.6 
  npmGlobalPackages:
    @aws-amplify/cli: 9.2.1
    @contrast/contrast: 1.0.19
    aws-sdk: 2.1192.0
    corepack: 0.10.0
    esbuild: 0.18.2
    http-server: 14.1.1
    npm: 8.11.0

Describe the bug

When using the Analytics category to create endpoints in Pinpoint, Microsoft Edge is incorrectly identified as Google Chrome. This is because the "getBrowserType" function in the "getClientInfo" utils file only matches "Trident" and "Edge", when the Edge user agents are "Edge", "Edg", "EdgA" and "EdgiOS".

Expected behavior

Pinpoint endpoints are created reliably for Microsoft Edge.

Reproduction steps

1. Add the Auth and Analytics categories to a project.
2. Add authentication support to the project as per https://docs.amplify.aws/react/prev/build-a-backend/auth/set-up-auth/
3. Add code to create a new endpoint for the user as per https://docs.amplify.aws/javascript/prev/build-a-backend/more-features/analytics/update-endpoint/ (v5) or https://docs.amplify.aws/javascript/build-a-backend/more-features/analytics/identify-user/ (v6).
4. Verify the Microsoft Edge user agent with console.info(window.navigator). The issue can only be reproduced if the user agent contains "Edg" (Windows / Mac) or "EdgA" (Android) or "EdgiOS" (Apple).
5. Start the project and access using Microsoft Edge.
6. Review Pinpoint and observe that an endpoint for Google Chrome has been created.

Code Snippet

// Put your code below this line.

Log output

// Put your logs below this line

aws-exports.js

No response

Manual configuration

No response

Additional configuration

No response

Mobile Device

No response

Mobile Operating System

No response

Mobile Browser

No response

Mobile Browser Version

No response

Additional information and screenshots

No response

[HuiSF]

Thanks for bringing this to our attention @gardin-davidl the original regular expression to detect the user agent can use an update for sure.

[cwomack]

@gardin-davidl, the fix for this issue is referenced above in PR #12661 and is currently on @unstable (6.0.7-unstable.829723b.0) which is pending release. Feel free to give it a try and let us know if it resolves your issue!

[gardin-davidl]

Looking good, thank you! Appreciate the quick turn-around.

[cwomack]

@gardin-davidl with v6.0.7 now live, I'll close out this issue. Feel free to comment back if you (or anyone else) experiences further problems!