Code Monkey home page Code Monkey logo

bugsnag-source-maps's Introduction

@bugsnag/source-maps

Installation

You can install @bugsnag/source-maps locally to your project:

npm install --save-dev @bugsnag/source-maps
yarn add --dev @bugsnag/source-maps

You can then run the CLI using the convenience tools for each package manager:

npx bugsnag-source-maps [...args]
yarn run bugsnag-source-maps [...args]

Or you can install the bugsnag-source-maps CLI tool globally on your system:

npm install --global @bugsnag/source-maps
yarn global add @bugsnag/source-maps

System requirements

@bugsnag/source-maps requires Node.js v10+

Usage

See the Bugsnag docs website for full usage documentation.

bugsnag-source-maps --help

  bugsnag-source-maps <command>

Available commands

  upload-browser
  upload-node
  upload-react-native

Options

  -h, --help    show this message
  --version     output the version of the CLI module

Bugsnag On-Premise

If you are using Bugsnag On-premise, you should use the endpoint option to set the url of your upload server, for example:

bugsnag-source-maps upload-browser \
  --endpoint https://bugsnag.my-company.com/
  # ... other options

Support

Contributing

Most updates to this repo will be made by Bugsnag employees. We are unable to accommodate significant external PRs such as features additions or any large refactoring, however minor fixes are welcome. See contributing for more information.

License

This package is free software released under the MIT License. See LICENSE.txt for details.

bugsnag-source-maps's People

Contributors

bengourley avatar djskinner avatar gingerbenw avatar imjoehaines avatar tomlongridge avatar twometresteve avatar yousif-bugsnag avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

bugsnag-source-maps's Issues

`--project-root` doesn't expand relative paths

Describe the bug

I have a monorepo, whose sourcemaps rely on node modules in the root directory as well as the app directory. I tried setting --project-root option to ../.., but that didn't work. When running the below commands, the uploader doesn't expand the relative path, and thus fails to strip the project root from the source maps.

cd apps/app-name
bugsnag-source-maps upload-browser --project-root ../.. --dist apps/app-name/dist

This should either be documented or the path should be expanded if stripProjectRoot requires an absolute path.

The work around is to pass an absolute path for this URL, but that's very inconvenient.

pushd ../../
PROJECT_PATH="$(pwd)"
popd
bugsnag-source-maps upload-browser --project-root "$PROJECT_ROOT" --dist apps/app-name/dist

Steps to reproduce

  1. Run above command with a relative path for --project-root

Environment

  • bugsnag-source-maps version: 2.3.1
  • Uploading for:
    • Browser
  • Command that was run: bugsnag-source-maps upload-browser

Example code snippet

bugsnag-source-maps upload-browser --project-root ../.. --dist apps/app-name/dist

Semver DOS moderate vulnerability

Describe the bug

image

The read-pkg-up version used for this lib has a deep dep that has currently a moderate warning for possible DOS.
Any chance you can update it? :) The latest versions use read-pkg 5+ which seems to have a more recent version without the issue

Steps to reproduce

yarn audit

Environment

  • bugsnag-source-maps version:
  • Uploading for:
    • Browser
    • Node
      • Node version:
    • React Native
      • React Native version:
  • Command that was run:

Example Repo

  • Create a minimal repository that can reproduce the issue
  • Link to it here:

Example code snippet

# (Insert code sample to reproduce the problem)
Error messages:

Uploaded source map not linking due to js file name differences

I'm trying to link my uploaded source map files to my React app errors that Bugsnag is capturing.

I'm using GitHub Actions for continuous deployment to deploy my Create React App project. The JavaScript file names it produces differs from when I run my build process locally.

For example, my deployed files are:

static/js/2.8e5de7fe.chunk.js
static/js/main.0abf3fdb.chunk.js

While my locally built files (using react-scripts build) are:

static/js/2.8ec2572f.chunk.js
static/js/2.8ec2572f.chunk.js.map
static/js/3.dfe9b29a.chunk.js
static/js/3.dfe9b29a.chunk.js.map
static/js/main.30c071e7.chunk.js
static/js/main.30c071e7.chunk.js.map
static/js/runtime-main.fb539f5c.js
static/js/runtime-main.fb539f5c.js.map

The source maps are being uploaded properly as they can be seen in the Bugsnag console:

image

However, whenever an error is captured, it doesn't link to the source maps:

image

I tried this with and without setting appVersion. Here's the example where I do set the appVersion:

Notifier:

  Bugsnag.start({
    apiKey,
    appVersion: '0.1.0',
    plugins: [new BugsnagPluginReact()],
  });

Source map upload:

const { browser } = require('@bugsnag/source-maps');

browser
  .uploadMultiple({
    apiKey,
    appVersion: '0.1.0',
    baseUrl: 'https://student.examind.io/static/js/',
    directory: 'build/static/js',
  })

When I tested without appVersion, I did exactly the same thing as above but with the appVersion property omitted.

How do I link my JavaScript files to the uploaded source maps if my CI tool produces different file names than the build I generate locally?

`bugsnag-source-maps upload-react-native` is timing out

This started failing recently for us. Is this a service issue or did something change? Using the latest 2.1.0 version.

$ /Users/nicholashodapp/Documents/Projects/iOS/Narwhal/node_modules/.bin/bugsnag-source-maps upload-react-native --api-key ***redacted*** --code-bundle-id com.remitly.remitly --platform ios --source-map ./build/ios/index.ios.bundle.map --bundle ./build/ios/index.ios.bundle
ℹ Preparing upload of React Native source map (release / ios)                       13:39:25
› Reading source map "./build/ios/index.ios.bundle.map"                             13:39:25
› Reading bundle file "./build/ios/index.ios.bundle"                                13:39:26
ℹ Applying transformations to source map                                            13:39:26
› Ensuring sourcesContent field is populated                                        13:39:26
› Stripping project root from sources                                               13:39:26
› Initiating upload to "https://upload.bugsnag.com/react-native-source-map"         13:39:26

 ERROR  The request timed out.                                                      13:44:32

 Connection timed out

  at ClientRequest.<anonymous> (node_modules/@bugsnag/source-maps/dist/Request.js:190:21)
  at Object.onceWrapper (events.js:421:28)
  at ClientRequest.emit (events.js:315:20)
  at TLSSocket.emitRequestTimeout (_http_client.js:709:9)
  at Object.onceWrapper (events.js:421:28)
  at TLSSocket.emit (events.js:327:22)
  at TLSSocket.Socket._onTimeout (net.js:482:8)
  at listOnTimeout (internal/timers.js:549:17)
  at processTimers (internal/timers.js:492:7)

error Command failed with exit code 1.

TypeError: Cannot read property 'name' of undefined

Describe the bug

When trying uploading source maps I'm seeing the following error:

TypeError: Cannot read property 'name' of undefined
    at FormData._getContentDisposition (/_work/example/example/node_modules/@bugsnag/source-maps/node_modules/form-data/lib/form_data.js:226:40)
    at FormData._multiPartHeader (/_work/example/example/node_modules/@bugsnag/source-maps/node_modules/form-data/lib/form_data.js:177:33)
    at FormData.append (/_work/example/example/node_modules/@bugsnag/source-maps/node_modules/form-data/lib/form_data.js:70:21)
    at createFormData (/_work/example/example/node_modules/@bugsnag/source-maps/dist/Request.js:47:14)
    at Promise (/_work/example/example/node_modules/@bugsnag/source-maps/dist/Request.js:92:30)
    at new Promise (<anonymous>)
    at /_work/example/example/node_modules/@bugsnag/source-maps/dist/Request.js:91:16
    at Generator.next (<anonymous>)
    at /_work/example/example/node_modules/@bugsnag/source-maps/dist/Request.js:8:71
    at new Promise (<anonymous>)
const { browser } = require("@bugsnag/source-maps")

browser
    .uploadMultiple({
        apiKey: apiKey,
        baseUrl: baseUrl,
        directory: dirAbsolutePath,
        overwrite: true,
        appVersion: appVersion,
        logger: logger,
    })
    .catch((error) => {
        console.log(error)
        process.exit(1)
    })

Steps to reproduce

Use the uploadMultiple api to try and upload multiple bundles and source maps to bugsnag. It fails with the above exception.

Environment

  • bugsnag-source-maps version: 2.0.0
  • Uploading for:
    • Browser
    • Node
      • Node version:
    • React Native
      • React Native version:
  • Command that was run:

Example Repo

const fs = require("fs")
const path = require("path")
const { browser } = require("@bugsnag/source-maps")

const logger = {
    trace: (m) => console.log(m),
    debug: (m) => console.log(m),
    info: (m) => console.log(m),
    success: (m) => console.log(m),
    warn: (m) => console.log(m),
    error: (m) => console.log(m),
    fatal: (m) => console.log(m),
    level: Infinity,
}

let apiKey
let baseUrl
if (process.env.BUILD_CONFIGURATION === "production") {
    console.log("production build detected")
    apiKey = process.env.BUGSNAG_PROD_API_KEY
    baseUrl = "https://example.com"
} else if (process.env.BUILD_CONFIGURATION === "integration") {
    console.log("integration build detected")
    apiKey = process.env.BUGSNAG_INTERNAL_API_KEY
    baseUrl = "https://example.com"
} else {
    throw new Error(
        `Unexpected build configuration: ${process.env.BUILD_CONFIGURATION}`
    )
}

const dirRelativePath = "./firebase/public/example"
if (!fs.existsSync(dirRelativePath")) {
    throw new Error(`'${dirRelativePath}' doesn't exist`)
}
const dirAbsolutePath = path.resolve(dirRelativePath)
console.log(`Trying to upload absolute path ${dirAbsolutePath}`)

// interface UploadMultipleOpts {
//     apiKey: string;
//     baseUrl: string;
//     directory: string;
//     appVersion?: string;
//     overwrite?: boolean;
//     projectRoot?: string;
//     endpoint?: string;
//     detectAppVersion?: boolean;
//     requestOpts?: http.RequestOptions;
//     logger?: Logger;
// }
browser
    .uploadMultiple({
        apiKey: apiKey,
        baseUrl: baseUrl,
        directory: dirAbsolutePath,
        overwrite: true,
        appVersion: process.env.GITHUB_RUN_NUMBER,
        logger: logger,
    })
    .catch((error) => {
        console.log(error)
        process.exit(1)
    })

Can't get source maps to work due to delete before going production

Describe the bug

My project was built with CRA and I've eject it afeter...I was trying to upload my map files using BugsnagSourceMapUploaderPlugin from webpack-bugsnag-plugins.
It seems to upload the chunk files, but doesn't get the map files. This may because I delete the .map files before sending the project to my server.
The same occurs if I try to use the command to upload multiple,

There is some way to still get the map files to work in bugsnag but delete them from production env?

Environment

  • Uploading for:
    • Browser
    • Node
      • Node version:
    • React Native
      • React Native version:

Encoded URI for source URLs (Next.js)

This is a specific problem with Next.js but I'm wondering how many others might be affected by this.

Problem

When uploading source map URLs to Bugsnag, the URL uses characters that aren't encoded. For example, */_next/chunks/pages/posts/[id]/index-7bb752abed79eb3123b5.js. When this URL gets loaded in the browser, it tries to match against */_next/chunks/pages/posts/%5Bid%5D/index-7bb752abed79eb3123b5.js. The source map misses.

Fix

This url should use encodeURI so properly escape characters like [ so that URLs match.

cli exiting with code 1 without logs

Hi everyone.

I have been facing an issue with the CLI that exits with code 1 without showing any log to help me debug.

I'm running the following command:

First, I build my nodeJS app, and it creates the build folder with my source maps because my tsconfig file has the option sourceMaps: true

yarn build

After that I run the following command:

 bugsnag-source-maps upload-node --api-key my-key --app-version 1328.0.0 --directory build --overwrite

So, I received the following output in my terminal.

Preparing upload of node source maps for "build"                                                                                                                                                                                  
› Searching for source maps "build"  

After that, it exits with code 1 without logs to help me debug.

My Node version is: v18.18.2
My Yarn version is: 3.6.1
bugsnag cli version: v2.3.1

Any idea?

Differ source maps per release stage and appType

Hello!

We've integrated Bugsnag into our projects and now we're willing to upload typescript's source maps for them.
And there is an issue with that.
We have a bunch of Node.js micro-services written in Typescript and register Bugsnag notifier in every single MS like so:

bugsnag.register(<KEY>, {
  releaseStage: process.env.ENVIRONMENT,
  appVersion: packageJson.version,
  appType: packageJson.name,
  ...
}

These options (releaseStage, appType) help us to reliably determine which particular micro-service has thrown an error and identify the source of issue uniquely.

But unfortunately, there're no such options for source maps.
As we have multiple micro-services in various release stages and in different versions, we're willing to have a unique set of source maps for every single build from that combinations, say for awesome-microservice of version 6.4 deployed to staging.

The idea was in using uploadMultiple (when every particular micro-service starts) in a following manner:

export const uploadSourceMapsToBugsnag = async (directory, projectRoot) {
....
  const apiKey = <KEY>;
  const appVersion = packageJson.version;

  try {
    await node.uploadMultiple({
      apiKey,
      appVersion,
      directory,
      projectRoot,
      overwrite: true,
    });
  } catch (err) {
    ...
  }
}

But that leads to conflicts between files from different builds. Files with same names just override.
We can add more specifics into an appVersion option, say include release stage and micro-service's name into it in some custom manner, say make it look like so: staging_awesome-service-6.4.
But how Bugsnag notifier would do the mapping in that case, how it identify the target source-maps's bundle and link it with a build which was originated an error?

In other words, will you please clarify how to upload source maps for multiple micro-services with several release stages and various version inside one project and link them to specific builds?

Reading manuals didn't help unfortunately.

Thank you.

Browser.updloadMultiple is slower than running many Browser.uploadOne

Description

We have recently started using esbuild, switching away from sprockets. (Runnig a rails app)
In this process we starting shipping our sourceMaps to bugsnag.

At this point we have about 50 assets which are processed by esbuild and shipped to bugsnag, but we ship them as both esModules and as CommonJS so essentially 80 files we need to upload+their sourcemaps.

With using browser.uploadMultiple this takes about 45-50 secs, but when we do schedule all at once(with one call to browser.uploadOne per file and a Promise.all wrapping it) we end up spending 6-7 secs on upload.

  return Promise.all(
    filePaths.flatMap((filePath) => {
      return [
        browser.uploadOne({...uploadArgs, bundleUrl: `https://${process.env.DOMAIN}/dist/${filePath}`, sourceMap: `${filePath}.map`}),
      ]
    })
  )

Describe the solution you'd like
I would like browser.uploadMultiple to to find all the files on disk and schedule all requests at the same time so they will be processed in parallel.

Describe alternatives you've considered
I found my work around so im fine atm.
But i don't know how good your servers handle it when i suddenly ship 1000 sourcemaps at the same time, I did not implement any limiting, but that is a thing which I belive you could easily make people do if you provide it through browser.uploadMultiple

We will probably hit about 1000 files when we move all our assets from sprockets to esbuild.

I belive this would make people happy, since their deploys will be faster, and if 100 people ship 1000 assets at the same time people might start getting weird errors.

NodeJS (TypeScript) source files don't seem to be uploaded when `--upload-sources` is set

Describe the bug

We have a TypeScript project with a relatively common layout where our source files live in src, and during build, get transpiled into lib. The transpilation generates a .js and .js.map file for each .ts file it finds, as expected. The map files do include the path to the source file.

When uploading the source maps for a release with the --upload-sources flag set, the actual .ts sources do not seem to be uploaded to BugSnag. This is further confirmed by all error stacks showing the .js file instead of .ts.

Steps to reproduce

We are running the following command from the root of our project (src and lib folders exist side-by-side):

bugsnag-sourcemaps upload \
  --api-key=${BUGSNAG_API_KEY} \
  --app-version=${VERSION} \
  --directory \
  --upload-sources \
  --overwrite

The logs that we see during this show all the .js.map files being uploaded, but no .ts files:

[info] Found 109 source map(s) to upload  
...
[info] Uploading (api-error-handler.js.map)                                                                                                                                                                                      
[info] Upload successful (passport-platform.js.map)                                                                                                                                                                              
[info] Uploading (index.js.map)                                                                                                                                                                                                  
[info] Upload successful (index.js.map)                                                                                                                                                                                          
[info] Uploading (ui-error-handler.js.map)                                                                                                                                                                                       
[info] Upload successful (utils.js.map)                                                                                                                                                                                          
[info] Uploading (utils.js.map)                                                                                                                                                                                                  
[info] Upload successful (api-error-handler.js.map)                                                                                                                                                                              
[info] Uploading (index.js.map)                                                                                                                                                                                                  
[info] Upload successful (type-parsing.js.map)                                                                                                                                                                                   
[info] Uploading (request-id.js.map)         
...

Interestingly, the source maps listing for the project in the Bugsnag UI shows the .js files, but does not appear to show the .js.map files.

I have confirmed the map files link to the corresponding .ts files by examining one and finding "sources":["../../../src/controllers/monitor/bugsnag.ts"].

Environment

  • bugsnag-source-maps version:
  • Uploading for:
    • Browser
    • Node
      • Node version: v14.16.0
    • React Native
      • React Native version:
  • Command that was run: See above code block

This feels like I've missed a setting or misunderstood something in the documentation, but I can't seem to find it. Please let me know if more info is needed. Thanks for the help!

Ignore query params when searching for a bundle file

Description

Hello BugSnag team 👋

I am having trouble setting up sourcemaps for a remix project that is being run via remix-serve (default remix server). The thing is that remix-serve by default adds a query param while loading a file, this in turn - as far as I understand - makes it impossible for BugSnag to load previously uploaded source maps.

The uploaded bundle file format is index.js, source map format is index.js.map. index.js has a proper reference to the map one at the end of the file - //# sourceMappingURL=index.js.map
However, due to the the addition of extra query param added by remix-serve, the file referenced in the error looks like below:

***/build/index.js?t=1711562424160.4358:1415:4

If my assumption that BugSnag doesn't allow for extra query params in the file name is true, do you consider adding support for that in the future?

Describe the solution you'd like

I would like BugSnag to allow wildcards/file patterns for bundle files while uploading the source maps. Alternatively, BugSnag could be looking for a bundle file ignoring query params.

Describe alternatives you've considered

N/A

Additional context

Fun fact: when I rename the bundle file to include some query param (let's say I name it index.js?foo=bar) and upload it like that (let's say via bugsnag-source-maps upload-node CLI), the UI shows the file without query param being presence (it's present as index.js). It suggests to me that query parameters shouldn't be taken into consideration while BugSnag is looking for a bundle file.

And yes, I have verified that uploaded source maps have the same appVersion as my notifier, so this is not the issue.

Dependencies need to be upgraded for security purposes

Dependencies need to be upgraded for security purposes. From dependabot audits:

@bugsnag/[email protected] requires semver@2 || 3 || 4 || 5 via a transitive dependency on [email protected]

The alert explains further:

Versions of the package semver before 7.5.2 on the 7.x branch, before 6.3.1 on the 6.x branch, and all other versions before 5.7.2 are vulnerable to Regular Expression Denial of Service (ReDoS) via the function new Range, when untrusted user data is provided as a range.

In my Vue app, bugsnag shows incorrectly the error line in vue file the preview

In my Vue app, bugsnag shows incorrectly the error line in vue file the preview.

In this example error is supposed to be in setup() function in the <script> section, instead it's in the section:
Monosnap ReferenceError in web-ordering 🔊 2023-01-18 12-17-39

Steps to reproduce

  1. Setup a Nuxt 3 project
  2. Integrate bugsnag any way
  3. Upload sourcemaps
  4. Trigger error

Environment

  • bugsnag-source-maps version: 2.3.1
  • Uploading for:
    • [*] Browser
    • [*] Node
      • Node version: v16.18.1
    • React Native
      • React Native version:
  • Command that was run:

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.