APM Workshop Pet Clinic demo error

Elastic Observability APM
1

Browser version: Firefox

Original install method (e.g. download page, yum, deb, from source, etc.) and version: github

Fresh install or upgraded from other version? fresh

Description of the problem including expected versus actual behavior. Please include screenshots (if relevant): After attending an APM workshop I attempted to deploy the Spring-Petclinic code in my own environment. It is available on github at
'https://github.com/adamquan/spring-petclinic'. Deployment went fine until the Client side deployment, which really amounted to running 'npm install' and then 'npm start' in the right folder. All other processes started and were running as expected. Starting npm on the Client caused numerous errors, all of which started with not being able to find 'fetch'.

On reading into the code, particularly the lines in files indicated in the error trace, I found a comment line that seemed to indicate the author's recognition that Elastic had not 'instrumented fetch'. I would read the lines of code that followed as some attempt to mitigate that fact. That said, the fact that my attempt to execute that code failed would seem to contradict that hypothesis. Either the code is meant to mitigate missing 'fetch' logic or it may be meant to mitigate by use of some alternate code that was not included in the github distribution. Perhaps some pip install would address a missing dependency.

Steps to reproduce:

  1. follow the instructions on https://github.com/adamquan/spring-petclinic
  2. the 'client' terminal window 'npm start' (fourth terminal window) should cause the error
  3. should a raft of errors not appear (should the code work on someone's system), then my system configuration must be missing some dependency, and any assistance would be appreciated

Provide logs and/or server output (if relevant): I execute this in terminal windows on my Ubuntu 18.04 PC. I can provide an error trace later, but after the initial failed attempt to find 'fetch', fetch is apparently used by every other attempt to get a component, like React, and all fail.

2

Hi Adrian! I cannot reproduce this immediately but I might be doing some things differently than you are. Can you:

  • clarify where you see this error? is it the browser or the terminal?
  • if you get this in the browser, can you specify what page you opened and what version of Firefox you have?
  • if you see this in the terminal, can you specify what version of node you have?
  • can you post the full trace of the error?
3

Hi Dario,

The errors occur in the terminal after executing ‘npm start’. This is on the step that launches the ‘client’, or under folder ‘spring-petclinic-master/frontend/client’.

I need to check a couple of things at home. My node version should be current. I considered that it might need to be updated, so I did, but that didn’t resolve the issue. I can tell you the version
later.

Again, I need to get the full trace from my home PC. I will forward it first thing next week.

Thanks,

Adrian

image002.jpg

4

Hi Dario,

I attach two files:

  • First is the stack trace from npm start

  • Second is the index tsx file that contains code referenced in the trace

Line 8 in the second file is the one in question. On line 5 it contains the following comment:

// as fetch isn't instrumented yet by elastic APM

On line 27 is the first call to ‘fetch’ which is causing the exceptions.

Thanks,

Adrian

image002.jpg

(Attachment index.txt is missing)

(Attachment npmstart.txt is missing)

5

The text file attachments did not upload so here is the trace from npm start. A large chunk in the middle is left out due to size constraints:

root@adrian-asus-intel-ubuntu:/home/adrian/spring-pet-clinic/spring-petclinic/frontend/client# npm install
npm WARN lifecycle spring-petclinic-reactjs@0.0.1~postinstall: cannot run in wd %s %s (wd=%s) spring-petclinic-reactjs@0.0.1 typings install /home/adrian/spring-pet-clinic/spring-petclinic/frontend/client
npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents@1.2.9
root@adrian-asus-intel-ubuntu:/home/adrian/spring-pet-clinic/spring-petclinic/frontend/client# clear
root@adrian-asus-intel-ubuntu:/home/adrian/spring-pet-clinic/spring-petclinic/frontend/client# npm start

spring-petclinic-reactjs@0.0.1 start /home/adrian/spring-pet-clinic/spring-petclinic/frontend/client
webpack-dev-server --host 0.0.0.0 --port 8081 --disable-host-check --open

Project is running at http://0.0.0.0:8081/
webpack output is served from /
404s will fallback to /index.html
ts-loader: Using typescript@2.0.10 and /home/adrian/spring-pet-clinic/spring-petclinic/frontend/client/tsconfig.json
Unable to open browser. If you are running in a headless environment, please do not use the open flag.
Hash: af6a909eb01c18deebb5
Version: webpack 2.7.0
Time: 5422ms
Asset Size Chunks Chunk Names
public/fonts/montserrat-webfont.ttf 42.7 kB [emitted]
public/fonts/glyphicons-halflings-regular.eot 20.1 kB [emitted]
public/fonts/varela_round-webfont.eot 29 kB [emitted]
public/fonts/glyphicons-halflings-regular.svg 109 kB [emitted]
public/fonts/glyphicons-halflings-regular.ttf 45.4 kB [emitted]
public/fonts/glyphicons-halflings-regular.woff 23.4 kB [emitted]
public/fonts/glyphicons-halflings-regular.woff2 18 kB [emitted]
public/fonts/montserrat-webfont.svg 84.6 kB [emitted]
public/fonts/montserrat-webfont.eot 21 kB [emitted]
public/fonts/montserrat-webfont.woff 24.2 kB [emitted]
public/fonts/varela_round-webfont.svg 370 kB [emitted] [big]
public/fonts/varela_round-webfont.ttf 63 kB [emitted]
public/fonts/varela_round-webfont.woff 32.7 kB [emitted]
index.js 2.36 MB 0 [emitted] [big] main
index.js.map 2.93 MB 0 [emitted] main
index.html 545 bytes [emitted]
chunk {0} index.js, index.js.map (main) 2.32 MB [entry] [rendered]
[11] ./src/main.tsx 6.34 kB {0} [built] [6 errors]
[14] ./src/util/index.tsx 5.15 kB {0} [built] [3 errors]
[23] ./~/react-router/lib/index.js 4.6 kB {0} [built]
[274] (webpack)-dev-server/client?http://0.0.0.0:8081 7.93 kB {0} [built]
[277] ./src/Root.tsx 343 bytes {0} [built] [2 errors]
[305] ./~/elastic-apm-js-base/src/index.js 1.67 kB {0} [built]
[359] ./~/loglevel/lib/loglevel.js 7.86 kB {0} [built]
[447] ./~/react-hot-loader/index.js 40 bytes {0} [built]
[496] ./~/strip-ansi/index.js 161 bytes {0} [built]
[498] ./src/styles/less/petclinic.less 1.07 kB {0} [built]
[500] ./~/url/url.js 23.3 kB {0} [built]
[504] (webpack)-dev-server/client/overlay.js 3.67 kB {0} [built]
[506] (webpack)/hot nonrecursive ^./log$ 160 bytes {0} [built]
[507] (webpack)/hot/emitter.js 77 bytes {0} [built]
[508] multi (webpack)-dev-server/client?http://0.0.0.0:8081 ./src/main.tsx 40 bytes {0} [built]
+ 494 hidden modules

ERROR in ./src/util/index.tsx
(27,10): error TS2304: Cannot find name 'fetch'.

ERROR in ./src/util/index.tsx
(52,10): error TS2304: Cannot find name 'fetch'.

ERROR in ./src/util/index.tsx
(108,10): error TS2304: Cannot find name 'fetch'.

ERROR in /home/adrian/spring-pet-clinic/spring-petclinic/frontend/client/src/types/index.ts
(1,25): error TS2307: Cannot find module 'react-router'.

ERROR in /home/adrian/spring-pet-clinic/spring-petclinic/frontend/client/src/react-datepicker.d.ts
(1,24): error TS2307: Cannot find module 'react'.

ERROR in /home/adrian/spring-pet-clinic/spring-petclinic/frontend/client/src/react-autosuggest.d.ts
(1,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/main.tsx
(1,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/main.tsx
(2,27): error TS2307: Cannot find module 'react-dom'.

ERROR in ./src/main.tsx
(5,43): error TS2307: Cannot find module 'react-router'.

ERROR in ./src/main.tsx
(7,17): error TS2304: Cannot find name 'require'.

ERROR in ./src/main.tsx
(9,1): error TS2304: Cannot find name 'require'.

ERROR in ./src/main.tsx
(189,21): error TS2304: Cannot find name 'require'.

ERROR in ./src/configureRoutes.tsx
(1,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/configureRoutes.tsx
(2,45): error TS2307: Cannot find module 'react-router'.

ERROR in ./src/components/visits/VisitsPage.tsx
(1,24): error TS2307: Cannot find module 'react'.

...

ERROR in ./src/Root.tsx
(1,24): error TS2307: Cannot find module 'react'.

ERROR in ./src/Root.tsx
(2,20): error TS2304: Cannot find name 'require'.
Child html-webpack-plugin for "index.html":
chunk {0} index.html 542 kB [entry] [rendered]
[0] ./~/lodash/lodash.js 540 kB {0} [built]
[1] ./~/html-webpack-plugin/lib/loader.js!./src/index.html 701 bytes {0} [built]
[2] (webpack)/buildin/global.js 509 bytes {0} [built]
[3] (webpack)/buildin/module.js 517 bytes {0} [built]
webpack: Failed to compile.

The following is the first part of the index.tsx file:
import { IHttpMethod } from '../types/index';
export const url = (path: string): string => /${path};
import { APMService } from '../main';

// as fetch isn't instrumenented yet by elastic APM
export const xhr_request = (path: string, onSuccess: (status: number, response: any) => any) => {
const requestUrl = url(path);
const xhr = new XMLHttpRequest();
xhr.open('GET', requestUrl, true);
xhr.onload = function(e) {
if (xhr.status < 400) {
onSuccess(xhr.status, JSON.parse(xhr.responseText));
} else {
APMService.getInstance().captureError(Failed GET on ${requestUrl} - ${xhr.status} ${xhr.statusText});
onSuccess(xhr.status, {});
}
};
xhr.onerror = function(e) {
APMService.getInstance().captureError(Failed GET on ${requestUrl} - ${xhr.status} ${xhr.statusText});
onSuccess(xhr.status, {});
};
xhr.send(null);
};

6

Hi Adrian,

the following line from your trace makes me think it could be a permission issue:

npm WARN lifecycle spring-petclinic-reactjs@0.0.1~postinstall: cannot run in wd %s %s (wd=%s) spring-petclinic-reactjs@0.0.1 typings install /home/adrian/spring-pet-clinic/spring-petclinic/frontend/client

Can you check if that's the case? Not sure with what permissions npm install was ran. A last resort could be wiping your folder and doing a clean checkout.

7

I switch to root in each terminal I open.

I noted a couple of warning messages. I tend to believe they are just that, warnings, not errors, but I have been concerned what might be affected in terms of dependencies.

I will try wiping and doing a clean checkout.

Thanks,
Adrian

8

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.