In JavaScript: How to find out if Vaadin is running in development mode?

Flow
1

In development mode, the Vaadin client prints many messages to the console, but is quiet in production.
I want the same for my own javascript, and so far the thing I came up with is:

const w = (window as any)
const flowAppIds: Array<String> = w.Vaadin.Flow.getAppIds()
this.debug = flowAppIds.filter((id) => w.Vaadin.Flow.getApp(id).getConfig("debug") === true).length > 0

But it seems as if there should be a better way… is there any?

2

How about the Vaadin.developmentMode variable?

3

Nah… too easy.

That’s definitely easier, thanks!

1 Like
4

In @vaadin/components/base/custom_typings/vaadin.d.ts, interface Vaadin this variable is not defined… should it be?

5

It would make sense to me to have it there. Maybe you can create an issue for it:

6

Ok, after looking a little more, I think, that variable should not be defined there. (a) this interface is not exported from components-base/custom_typings, and (b) there’s already a module that takes care of checking the devmode: @vaadin/vaadin-development-mode-detector. This module is the place wherewindow.Vaadin.developmentMode is set.

So, the way to go seems to be:

import { runIfDevelopmentMode } from '@vaadin/vaadin-development-mode-detector/vaadin-development-mode-detector.js';

runIfDevelopmentMode(() => { this.debug = true })

However, this does not work with typescript, as @vaadin/vaadin-development-mode-detector lacks a d.ts-module definition.

Adding one inside node_modules with just

export { runIfDevelopmentMode } from './vaadin-development-mode-detector.js

does the trick and I think would also be useful for others. I’ll open an issue for adding this… if i find the correct repository :slight_smile: