Environment (Required on creation):

Linux 5.10.123, applies to all other environments

Description (Required on creation; please attach any relevant screenshots, stacktraces, log files, etc. to the ticket):

The way config.js is imported from camunda-config-bootstrap.js, causes Amazon WAF to block the request and return 403. The WAF rule that blocks the request is LFI_URIPATH. The description of this rule in Amazon WAF documentation is:

"Inspects for the presence of Local File Inclusion (LFI) exploits in the URI path. Examples include path traversal attempts using techniques like ../../."

The code excerpt from camunda-config-nootstrap.js is as follows:
const baseImportPath = document.querySelector("base").href + "../";

Later, this baseImportPath is used to import the config.js under scripts folder and the "../" causes this WAF rule to be triggered, making not only the cockpit ui, but also other UIs like the admin UI to be unusable in Amazon.

This code part to calculate the baseImportPath should fix the issue:
var basePath = document.querySelector("base").href;if (basePath.endsWith("/")) {
basePath = basePath.substring(0, basePath.length - 1);
}const baseImportPath = basePath.substring(0, basePath.lastIndexOf('/')) + "/";

Steps to reproduce (Required on creation):

This behavior is seen on 7.16.0 and 7.17.0. I haven't checked other versions. There is nothing to be done particularly. In Amazon Cloud, when WAF is in place, the Cockpit UI will not be displayed and a 403 will be received.

Observed Behavior (Required on creation):

Amazon WAF causes 403.

Expected behavior (Required on creation):

To be able to run the Camunda UI applications without change in Amazon environment when there is WAF in place. I must also add that any WAF (not only Amazon) would cause this error and trigger a 403. 

Root Cause (Required on prioritization):

The way config.js is included. Mainly, it is vulnerable to "local file inclusion" attacks. And the WAF rule blocks the request.

Solution Ideas (Optional):

Change this line in .js files throughout the project:
const baseImportPath = document.querySelector("base").href + "../";

Replace with the following code snippet that calculates the baseImportPath without ../.

var basePath = document.querySelector("base").href;if (basePath.endsWith("/")) {
basePath = basePath.substring(0, basePath.length - 1);
}const baseImportPath = basePath.substring(0, basePath.lastIndexOf('/')) + "/";

Hints (optional):