Graylog2 / Graylog2/graylog2-server

Edit Input Extractor Produces: can't access property "checked", this.getInputDOMNode() is undefined

Open
#27,037 2 comments 0 reactions 1 assignee Claimed by @patrickmann View on GitHub
bug frontend needs-backport triaged
Dominant language
Java
Stars
8.1k
Forks
1.1k
Avg merge
1d 20h
Merged PRs (30d)
217

Description

## Expected Behavior

When creating or editing an extractor, selecting the **CSV to Fields** converter should display the CSV converter configuration fields and allow the converter to be configured.

Existing extractors containing a CSV to Fields converter should also be editable normally.

## Current Behavior

Selecting **CSV to Fields** as a converter causes the Graylog web interface to crash with a JavaScript error.

The same error occurs in both of these cases:

1. Editing an existing extractor that already contains a CSV to Fields converter.
2. Creating a new extractor and adding the CSV to Fields converter.

The browser console reports:

```text
TypeError: can't access property "checked", this.getInputDOMNode() is undefined
getChecked Input.tsx:29
render CSVConverterConfiguration.tsx:53
```

The relevant portion of the full stack trace begins:

```text
can't access property "checked", this.getInputDOMNode() is undefined

Stack Trace:

Y+4L4tFN/p/this.getChecked@http://graylog:9000/assets/app.86492a5f244363c0892c.js:779:683
render@http://graylog:9000/assets/8effbc95-3731.4aa61717efdf8acc3a11.js:57:1857
s_@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:6436
hi@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:6223
Ji@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:46718
$i@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:41340
Dc@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:41268
ga@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:41117
A_@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:37328
Hi@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:38147
Cr@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:657:3290
4448/Go/<@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:35607

Component Stack:
Y+4L4tFN/p/this.getChecked@http://graylog:9000/assets/app.86492a5f244363c0892c.js:779:683
render@http://graylog:9000/assets/8effbc95-3731.4aa61717efdf8acc3a11.js:57:1857
s_@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:6436
hi@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:6223
Ji@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:46718
$i@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:41340
Dc@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:41268
ga@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:41117
A_@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:37328
Hi@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:38147
Cr@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:657:3290
4448/Go/<@http://graylog:9000/assets/vendor.47425a27d805abe41281.js:659:35607

```

The API requests associated with opening/editing the extractor return HTTP 200 responses. Existing extractors containing the CSV converter also continue to process messages successfully.

For example, an existing affected extractor contains the following converter configuration:

```json
"converters": [
{
"type": "csv",
"config": {
"column_header": "UlogdType,SourceInterface,DestinationInterface,SourceIP,DestinationIP,Protocol,SourcePort,DestinationPort"
}
}
]
```

That extractor is functioning and reports `converter_exceptions: 0`; it is only the web UI for configuring/editing the CSV converter that fails.

## Possible Solution

This appears to be a frontend issue in `CSVConverterConfiguration.tsx`.

The stack trace indicates that `CSVConverterConfiguration.render()` calls `Input.getChecked()`, which attempts to access:

```text
this.getInputDOMNode().checked
```

but `getInputDOMNode()` is undefined at that point.

Since the problem can be reproduced by adding CSV to Fields to a completely new extractor, it does not appear to be caused by legacy or malformed extractor configuration.

## Steps to Reproduce (for bugs)

1. Go to **System → Inputs** and select **Manage Extractors** for an input.
2. Create a new extractor.
3. Add a converter to the extractor.
4. Select **CSV to Fields**.
5. The extractor configuration UI immediately fails with `this.getInputDOMNode() is undefined`.

Alternatively:

1. Open an existing extractor that contains a CSV to Fields converter.
2. Click **Edit**.
3. The extractor configuration UI fails with the same JavaScript exception while rendering `CSVConverterConfiguration.tsx`.

## Context

I have existing extractors that use CSV to Fields converters. The extractors themselves continue to operate successfully and process messages without converter exceptions.

However, I cannot edit those extractors because opening the editor causes the frontend exception.

I also cannot create a new CSV to Fields converter because merely selecting that converter while creating a new extractor triggers the same error.

This effectively prevents CSV to Fields converters from being created or edited through the Graylog 7.1.7 web interface.

## Your Environment

* Graylog Version: **7.1.7+667ef52**
* Java Version: **Eclipse Adoptium 21.0.11**
* OpenSearch Version: **Running Graylog Datanode: 7.1.8+c7d1072**
* MongoDB Version: **mongo:7.0-jammy**
* Operating System: **Ubuntu 24.04.4 LTS (running in container)**
* Browser version: **Firefox 153.0.4** & **Google Chrome 151.0.7922.140**

## Checklist

[x] This issue fix need to be backported.
[ ] Does this issue have **security** implications?

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.