question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Prometheus integration breaks React App

See original GitHub issue

Hello again Nodeshift team!

I’d eagerly like to set your Opossum loose on my code. So far so good in Node.js land, but I am experiencing issues on the Browser side, particularly with sites generated using Create React App.

I noticed you have the following example here: https://github.com/nodeshift-starters/opossum-examples/tree/master/react

This example uses 1.9, which does work. I am able to replicate this issue in your example code with both 2.3 and 3.0 releases, since the addition of Prometheus.

When trying to build or run the library I get the following error:

$ npm run build

> react-opossum@0.1.0 build /Users/tvogel/src/default/opossum-examples/react/client
> react-scripts build

Creating an optimized production build...
Browserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`
Failed to compile.

./node_modules/prom-client/lib/cluster.js
Cannot find module: 'cluster'. Make sure this package is installed.

You can install this package by running: npm install cluster.

Opossum has an optional dependency on prom-client so it can export Prometheus metrics. Prometheus requires cluster, which is only available server-side: https://nodejs.org/api/cluster.html

This dependency gets required depending on an environment variable WEB not being set: https://github.com/nodeshift/opossum/blob/master/lib/circuit.js#L8-L10

Ideally we would just set this environment variable at build time, or on startup. But React App does not allow this: https://github.com/facebook/create-react-app/issues/6223

I also tried modifying the code to use process.env.REACT_APP_OPOSSUM and passing that in REACT_APP_OPOSSUM=true npm run build, but no luck… it might not accept environment variables at this stage, at all. Removing the import line seems to make it work again.

Not sure if there is another way to decouple the Prometheus concern from the Circuit Breaker, e.g. by using a wrapper object or something. Might also help to keep bundle sizes down… but that would definitely change your API quite a bit.

Any ideas?

Node.js Version: 10

Operating System: Mac OS

Steps to Produce Error:

git clone git@github.com:nodeshift-starters/opossum-examples.git
cd opossum-examples/react/client
npm install opossum@^3.0.0
npm run build

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:1
  • Comments:5 (4 by maintainers)

github_iconTop GitHub Comments

2reactions
helio-frotacommented, Aug 2, 2019

@tavogel thanks for report the issue.

This has relation with semver-major PR https://github.com/nodeshift/opossum/pull/350.

The Jquery example was updated to use opossum 3.0.0 It is using opossum.js directly from node_modules, I’m not sure but since jquery example don’t have a build step maybe because that the example works.

I think that issues with browser will be fixed after https://github.com/nodeshift/opossum/pull/350 if a solution does not come before for the particular case of react usage.

1reaction
helio-frotacommented, Aug 6, 2019

@tavogel @alexstojda The react example on opossum-examples is working with opossum 3.0.0

By using this way import circuitBreaker from 'opossum/dist/opossum';

https://github.com/nodeshift-starters/opossum-examples/blob/master/react/client/src/App.js#L2

Please let met know if it work for you

Read more comments on GitHub >

github_iconTop Results From Across the Web

How to SRE-ify your React app with Prometheus - LinkedIn
The objective was to take a broken web app and add enough monitoring and logging to it to make troubleshooting its brokenness easier....
Read more >
Add Prometheus metrics to your React App
The main objective of this package is to provide production runtime observability to React frontends, allowing to monitor and alert about ...
Read more >
Monitor React Applications with Prometheus - Asserts.ai
In this blog post, we will take a look at how we can use Prometheus to monitor React applications there by using a...
Read more >
Node.js Performance Monitoring with Prometheus
Prometheus is an open-source solution for Node.js monitoring and alerting. It provides powerful data compressions and fast data querying for ...
Read more >
Introducing Prometheus Agent Mode, an Efficient and Cloud ...
Furthermore, it enables application instrumentation and exporters to be dead ... to Prometheus for native integration and bigger adoption.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found