BurrowUI Browser errors and unable to run

Getting following console errors in my browser:

shim.min.js:1 Uncaught SyntaxError: Unexpected token <
zone.js:1 Uncaught SyntaxError: Unexpected token <
system.src.js:1 Uncaught SyntaxError: Unexpected token <
systemjs.config.js:1 Uncaught SyntaxError: Unexpected token <

(index):25 Uncaught ReferenceError: System is not defined

error_handler.js:54 EXCEPTION: Cannot read property 'host' of undefined

I'm running following versions:

node: v7.5.0
npm: v4.1.2
@angular/cli: 1.0.5
os: darwin x64

May 25 '17 09:05 supersonicclay

Are you able to see any part of the UI in your browser? Specifically; in the top right corner of the home view are you seeing "Burrow Server: Error"?

May 25 '17 11:05 cgosiak

This is what I see in the UI:

Here are some XHR network requests that it is making (the blocked out part is a list of consumer groups). The consumer group responses look like they're working:

And the "home" request:

Clicking "View consumers" and "View topics" has no visible effect. There are 178 consumer groups, so I thought it may just be slow. However, I waited multiple minutes and still nothing shows up in the UI.

May 26 '17 22:05 supersonicclay

Hello @claycephas

When debugging this; I think it may be helpful to let you know that the lists are gathered asynchronously and will be displayed on the page dynamically. So; even with large amounts of consumer groups you should see data show up almost immediately; depending on your connection.

It seems that there may be an early exception that is being mishandled; and stopping the view from being displayed.

Are you on the most current version of Burrow? I only ask; as it seem that there may be an error in serializing an endpoint.

May 30 '17 13:05 cgosiak

Hello @claycephas,

Did you get things worked out? If so, I will close the issue.

Jul 20 '17 18:07 cgosiak

@cgosiak Sorry for the delayed response. It looks like it might be something off with serving the javascript files and it isn't even getting to the point of rendering the consumers and topics to the UI.

shim.min.js:1 Uncaught SyntaxError: Unexpected token <
zone.js:1 Uncaught SyntaxError: Unexpected token <
system.src.js:1 Uncaught SyntaxError: Unexpected token <
systemjs.config.js:1 Uncaught SyntaxError: Unexpected token <

And these app is serving HTML not javascript for these files...

Here are my versions:

$ node -v
v8.1.4

$ ng --version
@angular/cli: 1.4.0
node: 8.1.4
os: darwin x64
@angular/common: 2.4.10
@angular/compiler: 2.4.10
@angular/core: 2.4.10
@angular/forms: 2.4.10
@angular/http: 2.4.10
@angular/platform-browser: 2.4.10
@angular/platform-browser-dynamic: 2.4.10
@angular/router: 3.4.10
@angular/cli: 1.4.0
@angular/compiler-cli: 2.4.10
typescript: 2.0.10

$ npm -v
5.3.0

The same thing happens when running the docker image:

docker run --rm -p 3000:3000 -e BURROW_HOME="..." generalmills/burrowui

Sep 09 '17 13:09 supersonicclay

It's interesting to me that not even the docket version is running correctly. Especially since you can see that data is making it to the browser layer, just not rendering any of the views. From your screenshots, it looks like you are using Google Chrome, is that correct? I am just curious in case it may be a browser incompatibility (Chrome is supported, but I have had some issues with rendering in the past with IE)

All the files showing errors in your log, are libraries that I included with the build, not necessarily libraries that I created. But it is still mind-boggling to me that the UI doesn't work from Docker.

Sep 11 '17 13:09 cgosiak

Yes, I'm using Chrome. But it also reproduces with simply curl.

$ docker run --rm -p 3002:3000 -e BURROW_HOME="http://.../v2/kafka" generalmills/burrowui
BURROW_HOME: http://.../v2/kafka
Burrow Home is Set
API running on 0.0.0.0:3000


$ curl localhost:3002/node_modules/zone.js/dist/zone.js
<!DOCTYPE html>
<html>

<head>
  <title>Kafka Analysis Tool</title>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <base href="/">
  <link rel="stylesheet" href="assets/css/styles.css">
  <link rel="stylesheet" href="assets/css/animations.css">

  <!--MDL-->
  <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
  <link rel="stylesheet" href="https://code.getmdl.io/1.3.0/material.teal-pink.min.css" />
  <script defer src="https://code.getmdl.io/1.3.0/material.min.js"></script>

  <!-- Polyfill(s) for older browsers -->
  <script src="node_modules/core-js/client/shim.min.js"></script>
  <script src="node_modules/zone.js/dist/zone.js"></script>
  <script src="node_modules/systemjs/dist/system.src.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.5.0/Chart.js"></script>

  <script src="systemjs.config.js"></script>
  <script>
    System.import('main.js').catch(function (err) {
      console.error(err);
    });
  </script>

</head>

--SNIP--

I think it is due to the catch all route in server.js:

// Catch all other routes and return the index file
app.get('*', (req, res) => {
  res.sendFile(path.join(__dirname, 'dist/index.html'));
});

Sep 11 '17 17:09 supersonicclay

I am getting the exact same error

Sep 14 '17 15:09 ballad89

I have the same issue, however, I was able to run it previously.

node  -v v8.5.0
@angular/cli: 1.4.2
node: 8.5.0
os: linux x64
@angular/cli: 1.4.2
node: 8.5.0
os: linux x64

Sep 18 '17 11:09 gorros

Alright, so one thing that I am starting to notice is that @gorros and @claycephas are both running Node v8.x; and previsously @claycephas was running v7.x. When I originally built this is was built off of LTS on v6.x

If @ballad89 can respond back with his Node version; which I would suspect is v7+ I think we may have found the culprit.

Then, I will try and find some time to build it out on a 8.x system and see if I can fix whats happening.

Sep 18 '17 12:09 cgosiak

I am running the docker container generalmills/burrowui

$ docker exec -it 926e9cd0e41c bash
root@926e9cd0e41c:/usr/src/app# node -v
v6.10.0

Sep 20 '17 09:09 ballad89

@cgosiak Currently everything works, but above errors are still present. In my case data was missing because of Burrow error.

Sep 20 '17 10:09 gorros

Well, I could not make your docker image work.

shim.min.js:1 Uncaught SyntaxError: Unexpected token <
zone.js:1 Uncaught SyntaxError: Unexpected token < These can be solved by symlinking node_modules into "dists" folder
system.src.js:1 Uncaught SyntaxError: Unexpected token <
systemjs.config.js:1 Uncaught SyntaxError: Unexpected token < These are solved by doing npm install systemjs

Then I have "TypeError: Cannot read property 'host' of undefined"

  constructor(private route: ActivatedRoute, private burrowService: BurrowService) {
    this.burrowService.getHome().subscribe(
      home => {
        this.burrowHome = home.request.host; # <-- HERE
      },
      error => {
        this.burrowHome = "Error";
      }
    );
  };

And I have no idea what to do with it, BURROW_HOME var is set and request does have the host header.

Also file: systemjs.config.js is nonexistent.

Oct 20 '17 15:10 dmitryilyin

Hello All,

I just wanted to give you an update on this. I recognize that there are some errors that are stopping functionality of the tool for some users. In the spirit of full disclosure; I just don't have the time to look into how to fix the error or what exactly is causing the errors for some users.

With that being said; I will actively keep an eye out for any pull requests that come my way.

I do not have a timeframe at this moment; but I will update this thread following any breakthroughs that I may have with this project.

Oct 20 '17 16:10 cgosiak

Same issue here with latest tag of docker image. That makes burrowui completely broken here.

Same error with Chrome, Safari and Firefox as well

Nov 22 '17 16:11 asyd

If I understood correctly the js below Polyfill(s) comments are not concatenated to the vendor.js from the cli so are searched on /node_modules/path of the nodejs static serve (that is not configured).

I tried to make a simple workaround (adding node folder to the file served from nodejs)

FROM generalmills/burrowui:latest
ADD ./server.js /usr/src/app

and added in server.js app.use('/node_modules',express.static(path.join(__dirname, 'node_modules'))); below the line app.use(express.static(path.join(__dirname, 'dist')));

but other errors come out, from my experience the ng build is not complete or the app is correcly comfigured to be served only from nodeJs:

polyfill is not bundled,
system.config.js is not present inside the docker

i sudjest to make a new build followind the "normal" way:

build FE app (angular app)
copy all the static file to nodeJS

if all the FE configuration are done correlcy (base tag and so on) all problem should be resolved

i did not have the time to go deep on this for solving the issue (really sorry)

May 28 '18 10:05 Jcbobo

Same issue. Getting some informations

Burrow Server: eb7f21c56bdf Consumers: 3 Topics: 135

These numbers are good but apart from that all the UI seems to be broken

Oct 30 '18 15:10 NotGael

BurrowUI BurrowUI copied to clipboard

Browser errors and unable to run

BurrowUI
BurrowUI copied to clipboard