Fix UI cutout for HTTP Probe properties input fields in ChaosCenter

[PriteshKiri]

Description

In ChaosCenter → Create Probes → HTTP Probe properties configuration, input fields such as Timeout, Interval, Attempt, and other properties display a UI cutout when focused. This creates a visual glitch and affects user experience.

The UI behavior should be consistent with the Name input field for HTTP probes, which does not show any cutout when focused.

Location

ChaosCenter → Create Probes → HTTP Probe properties configuration → Input fields (Timeout Interval, Attempt, etc.)

Reference

Steps to Reproduce

1. Open ChaosCenter and navigate to the Probes, create an HTTP probe, and go to the properties configuration section.
2. Click on any input field like Timeout Interval or Attempt.
3. Observe the UI cutout appearing around the input field.

Expected Behavior

• Input fields should not display any cutout or visual glitch when focused.
• Styling should be consistent with the Name input field.

Proposed Fix

• Update the CSS / component styling for all HTTP Probe property input fields to match the Name input field.
• Test focus behavior for all input fields in the HTTP Probe configuration.

[ADITYATIWARI342005]

Hi @PriteshKiri
Please assign it to me,
I will raise a PR soon,
Thank you.

[PriteshKiri]

@ADITYATIWARI342005 assigned. Happy Hacktoberfest! 🎃

Please ensure that:
• You sign the DCO when submitting your PR.
• You’ve gone through the Contribution Guide carefully.
• You complete this task within 3 days of the assignment date.

Thank you for showing interest in contributing to LitmusChaos! Feel free to reach out to us in our Slack community if you have any questions.

[PriteshKiri]

Hey @ADITYATIWARI342005
Thank you so much for your contribution! 🙌
Please keep an eye on your PR, as we may add some review comments if needed before merging it.

[ADITYATIWARI342005]

Hi @PriteshKiri ,
I was doing the setup of the project for the screenshot as you asked, but somehow the backend is not able to setup so I am stuck on the login page...

[ADITYATIWARI342005]

@PriteshKiri
Thank you for your continued review; it would be helpful if you could help me with this.

[PriteshKiri]

Hey @ADITYATIWARI342005

Did you tried following this guide?

[ADITYATIWARI342005]

yes! @PriteshKiri
But I was trying to do the setup in wsl as I use windows and most of the cncf projects use Linux,
If you could tell me which environment is suitable I will give it another try?

[PriteshKiri]

If you could tell me where excalty your setup is failing while following the guide. I can assist you better.

[ADITYATIWARI342005]

@PriteshKiri
Thank you for helping,
completing the mongodb server setup I had to start graphql server

cd ~/litmus
source setup-env.sh
cd chaoscenter/graphql/server
go run server.go

this is where it fails, this is the log

adityatiwari@ZEROBOOK13:~$ cd ~/litmus
source setup-env.sh
cd chaoscenter/graphql/server
go run server.go
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:41","func":"main.init.0","level":"info","msg":"go version: go1.24.0","time":"2025-10-27T10:39:25Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:42","func":"main.init.0","level":"info","msg":"go os/arch: linux/amd64","time":"2025-10-27T10:39:25Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/database/mongodb/init.go:110","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/database/mongodb.MongoConnection","level":"info","msg":"connected to mongo","time":"2025-10-27T10:39:25Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:182","func":"main.main","level":"info","msg":"graphql server running at http://localhost:3000","time":"2025-10-27T10:39:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/chaoshub/service.go:976","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/chaoshub.(*chaosHubService).SyncDefaultChaosHubs","level":"info","msg":"syncing default chaos hub directories","time":"2025-10-27T10:39:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/chaoshub/ops/gitops.go:174","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/chaoshub/ops.ChaosHubConfig.chaosChartSyncHandler","level":"info","msg":"executed isRepositoryExists()... ","repositoryExists":false,"time":"2025-10-27T10:39:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/projects/project_handler.go:60","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/projects.ProjectEvents","level":"error","msg":"(Location40573) The $changeStream stage is only supported on replica sets","time":"2025-10-27T10:39:26Z"}
panic: runtime error: invalid memory address or nil pointer dereference
[signal SIGSEGV: segmentation violation code=0x1 addr=0xe0 pc=0x12044dc]

goroutine 103 [running]:
go.mongodb.org/mongo-driver/mongo.(*ChangeStream).next(0x0?, {0x1cd7710?, 0x2a23780?}, 0x1?)
        /home/adityatiwari/go/pkg/mod/go.mongodb.org/mongo-driver@v1.16.1/mongo/change_stream.go:628 +0x1c
go.mongodb.org/mongo-driver/mongo.(*ChangeStream).Next(...)
        /home/adityatiwari/go/pkg/mod/go.mongodb.org/mongo-driver@v1.16.1/mongo/change_stream.go:608
github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/projects.ProjectEvents(0x0?, 0xc00016a7e0, {0x1ce4b70, 0xc0000a0000})
        /home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/projects/project_handler.go:66 +0x230
created by main.main in goroutine 1
        /home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:162 +0x1007
exit status 2
adityatiwari@ZEROBOOK13:~/litmus/chaoscenter/graphql/server$ cd ~/litmus
source setup-env.sh
cd chaoscenter/graphql/server
go run server.go
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:41","func":"main.init.0","level":"info","msg":"go version: go1.24.0","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:42","func":"main.init.0","level":"info","msg":"go os/arch: linux/amd64","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/database/mongodb/init.go:110","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/database/mongodb.MongoConnection","level":"info","msg":"connected to mongo","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/database/mongodb/init.go:132","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/database/mongodb.(*MongoClient).initAllCollection","level":"info","msg":"chaosInfrastructures's collection already exists, continuing with the existing mongo collection","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/database/mongodb/init.go:160","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/database/mongodb.(*MongoClient).initAllCollection","level":"info","msg":"chaosExperiments's collection already exists, continuing with the existing mongo collection","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/database/mongodb/init.go:188","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/database/mongodb.(*MongoClient).initAllCollection","level":"info","msg":"chaosExperimentRuns's collection already exists, continuing with the existing mongo collection","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/database/mongodb/init.go:210","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/database/mongodb.(*MongoClient).initAllCollection","level":"info","msg":"chaosHubs's collection already exists, continuing with the existing mongo collection","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/database/mongodb/init.go:293","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/database/mongodb.(*MongoClient).initAllCollection","level":"info","msg":"chaosProbes's collection already exists, continuing with the existing mongo collection","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:182","func":"main.main","level":"info","msg":"graphql server running at http://localhost:3000","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/chaoshub/service.go:976","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/chaoshub.(*chaosHubService).SyncDefaultChaosHubs","level":"info","msg":"syncing default chaos hub directories","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/chaoshub/ops/gitops.go:174","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/chaoshub/ops.ChaosHubConfig.chaosChartSyncHandler","level":"info","msg":"executed isRepositoryExists()... ","repositoryExists":true,"time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/chaoshub/ops/gitops.go:162","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/chaoshub/ops.GitSyncDefaultHub","level":"error","msg":"error in executing Head: reference not found","time":"2025-10-27T10:41:26Z"}
{"error":"error in executing Head: reference not found","file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/chaoshub/service.go:992","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/chaoshub.(*chaosHubService).SyncDefaultChaosHubs","hubName":"Litmus ChaosHub","level":"error","msg":"failed to sync default chaos hubs","repoBranch":"master","repoUrl":"https://github.com/litmuschaos/chaos-charts","time":"2025-10-27T10:41:26Z"}
{"file":"/home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/projects/project_handler.go:60","func":"github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/projects.ProjectEvents","level":"error","msg":"(Location40573) The $changeStream stage is only supported on replica sets","time":"2025-10-27T10:41:26Z"}
panic: runtime error: invalid memory address or nil pointer dereference
[signal SIGSEGV: segmentation violation code=0x1 addr=0xe0 pc=0x12044dc]

goroutine 90 [running]:
go.mongodb.org/mongo-driver/mongo.(*ChangeStream).next(0x0?, {0x1cd7710?, 0x2a23780?}, 0x1?)
        /home/adityatiwari/go/pkg/mod/go.mongodb.org/mongo-driver@v1.16.1/mongo/change_stream.go:628 +0x1c
go.mongodb.org/mongo-driver/mongo.(*ChangeStream).Next(...)
        /home/adityatiwari/go/pkg/mod/go.mongodb.org/mongo-driver@v1.16.1/mongo/change_stream.go:608
github.com/litmuschaos/litmus/chaoscenter/graphql/server/pkg/projects.ProjectEvents(0x0?, 0xc0000009a0, {0x1ce4b70, 0xc0000a1540})
        /home/adityatiwari/litmus/chaoscenter/graphql/server/pkg/projects/project_handler.go:66 +0x230
created by main.main in goroutine 1
        /home/adityatiwari/litmus/chaoscenter/graphql/server/server.go:162 +0x1007
exit status 2