diff --git a/backend/pkg/console/topic_config_integration_test.go b/backend/pkg/console/topic_config_integration_test.go index c3d6b11a97..b52b5cd070 100644 --- a/backend/pkg/console/topic_config_integration_test.go +++ b/backend/pkg/console/topic_config_integration_test.go @@ -57,6 +57,26 @@ func (s *ConsoleIntegrationTestSuite) TestGetTopicConfigs() { assert.Equal(topicName, topicConfig.TopicName) assert.NotEmpty(topicConfig.ConfigEntries) + // Create a map out of the returned config options to spot check compiled values + configEntries := make(map[string]*TopicConfigEntry, len(topicConfig.ConfigEntries)) + for _, entry := range topicConfig.ConfigEntries { + configEntries[entry.Name] = entry + } + + // redpanda.remote.allowgaps isn't in the docs, but is coming from the server + assert.Contains(configEntries, "redpanda.remote.allowgaps") + assert.True(*configEntries["redpanda.remote.allowgaps"].Documentation != "") + + // redpanda.iceberg.mode is present in the rp json file, and should be in the Iceberg group + assert.Contains(configEntries, "redpanda.iceberg.mode") + assert.Equal(configEntries["redpanda.iceberg.mode"].ConfigCategory, "Iceberg") + + // redpanda.iceberg.delete is in the rp json file, but isn't returned by the server + assert.NotContains(configEntries, "redpanda.iceberg.delete") + + // compression.type is in the kafka json file + assert.Contains(configEntries, "compression.type") + assert.NotNil(topicConfig.ConfigEntries[0]) assert.False(topicConfig.ConfigEntries[0].IsReadOnly) } diff --git a/backend/pkg/embed/kafka/apache_kafka_configs.json b/backend/pkg/embed/kafka/apache_kafka_configs.json index c697d308f1..66e299ff52 100644 --- a/backend/pkg/embed/kafka/apache_kafka_configs.json +++ b/backend/pkg/embed/kafka/apache_kafka_configs.json @@ -4,7 +4,7 @@ "aliases": ["log_compression_type"], "type": "STRING", "documentation": "Specify the final compression type for a given topic. This configuration accepts the standard compression codecs ('gzip', 'snappy', 'lz4', 'zstd'). It additionally accepts 'uncompressed' which is equivalent to no compression; and 'producer' which means retain the original compression codec set by the producer.", - "category": "Storage", + "category": "Compression", "frontendFormat": "SELECT", "enumValues": ["uncompressed", "producer", "gzip", "lz4", "snappy", "zstd"] }, @@ -18,7 +18,7 @@ "name": "message.downconversion.enable", "type": "BOOLEAN", "documentation": "This configuration controls whether down-conversion of message formats is enabled to satisfy consume requests. When set to \"false\", broker will not perform down-conversion for consumers expecting an older message format. The broker responds with \"UNSUPPORTED_VERSION\" error for consume requests from such older clients. This configuration does not apply to any message format conversion that might be required for replication to followers.", - "category": "Storage Performance" + "category": "Message Handling" }, { "name": "min.insync.replicas", @@ -30,7 +30,7 @@ "name": "segment.jitter.ms", "type": "LONG", "documentation": "The maximum random jitter subtracted from the scheduled segment roll time to avoid thundering herds of segment rolling", - "category": "Storage Performance", + "category": "Storage Internals", "frontendFormat": "DURATION" }, { @@ -38,7 +38,7 @@ "aliases": ["log_cleanup_policy"], "type": "LIST", "documentation": "This config designates the retention policy to use on log segments. The \"delete\" policy (which is the default) will discard old segments when their retention time or size limit has been reached. The \"compact\" policy will enable \"log compaction\", which retains the latest value for each key. It is also possible to specify both policies in a comma-separated list (e.g. \"delete,compact\"). In this case, old segments will be discarded per the retention time and size configuration, while retained segments will be compacted.", - "category": "Storage", + "category": "Retention", "frontendFormat": "SELECT", "enumValues": ["delete", "compact", "compact,delete"] }, @@ -46,7 +46,7 @@ "name": "flush.ms", "type": "LONG", "documentation": "This setting allows specifying a time interval at which we will force an fsync of data written to the log. For example if this was set to 1000 we would fsync after 1000 ms had passed. In general we recommend you not set this and use replication for durability and allow the operating system's background flush capabilities as it is more efficient.", - "category": "Storage Performance", + "category": "Write Caching", "frontendFormat": "DURATION" }, { @@ -59,7 +59,7 @@ "name": "segment.bytes", "type": "INT", "documentation": "This configuration controls the segment file size for the log. Retention and cleaning is always done a file at a time so a larger segment size means fewer files but less granular control over retention.", - "category": "Storage", + "category": "Storage Internals", "frontendFormat": "BYTE_SIZE" }, { @@ -67,33 +67,33 @@ "aliases": ["delete_retention_ms"], "type": "LONG", "documentation": "This configuration controls the maximum time we will retain a log before we will discard old log segments to free up space if we are using the \"delete\" retention policy. This represents an SLA on how soon consumers must read their data. If set to -1, no time limit is applied.", - "category": "Storage", + "category": "Retention", "frontendFormat": "DURATION" }, { "name": "flush.messages", "type": "LONG", "documentation": "This setting allows specifying an interval at which we will force an fsync of data written to the log. For example if this was set to 1 we would fsync after every message; if it were 5 we would fsync after every five messages. In general we recommend you not set this and use replication for durability and allow the operating system's background flush capabilities as it is more efficient. This setting can be overridden on a per-topic basis (see \"the per-topic configuration section\").", - "category": "Storage Performance" + "category": "Write Caching" }, { "name": "message.format.version", "type": "STRING", "documentation": "[DEPRECATED] Specify the message format version the broker will use to append messages to the logs. The value of this config is always assumed to be `3.0` if `inter.broker.protocol.version` is 3.0 or higher (the actual config value is ignored). Otherwise, the value should be a valid ApiVersion. Some examples are: 0.10.0, 1.1, 2.8, 3.0. By setting a particular message format version, the user is certifying that all the existing messages on disk are smaller or equal than the specified version. Setting this value incorrectly will cause consumers with older versions to break as they will receive messages with a format that they don't understand.", - "category": "Storage" + "category": "Message Handling" }, { "name": "max.compaction.lag.ms", "type": "LONG", "documentation": "The maximum time a message will remain ineligible for compaction in the log. Only applicable for logs that are being compacted.", - "category": "Storage", + "category": "Compaction", "frontendFormat": "DURATION" }, { "name": "file.delete.delay.ms", "type": "LONG", "documentation": "The time to wait before deleting a file from the filesystem", - "category": "Storage", + "category": "Retention", "frontendFormat": "DURATION" }, { @@ -101,14 +101,14 @@ "aliases": ["kafka_batch_max_bytes"], "type": "INT", "documentation": "The largest record batch size allowed by Kafka (after compression if compression is enabled). If this is increased and there are consumers older than 0.10.2, the consumers' fetch size must also be increased so that they can fetch record batches this large. In the latest message format version, records are always grouped into batches for efficiency. In previous message format versions, uncompressed records are not grouped into batches and this limit only applies to a single record in that case.", - "category": "Storage", + "category": "Message Handling", "frontendFormat": "BYTE_SIZE" }, { "name": "min.compaction.lag.ms", "type": "LONG", "documentation": "The minimum time a message will remain uncompacted in the log. Only applicable for logs that are being compacted.", - "category": "Storage", + "category": "Compaction", "frontendFormat": "DURATION" }, { @@ -116,7 +116,7 @@ "aliases": ["log_message_timestamp_type"], "type": "STRING", "documentation": "Define whether the timestamp in the message is message create time or log append time. The value should be either `CreateTime` or `LogAppendTime`", - "category": "Storage", + "category": "Message Handling", "frontendFormat": "SELECT", "enumValues": ["CreateTime", "LogAppendTime"] }, @@ -124,20 +124,20 @@ "name": "preallocate", "type": "BOOLEAN", "documentation": "True if we should preallocate the file on disk when creating a new log segment.", - "category": "Storage Performance" + "category": "Storage Internals" }, { "name": "min.cleanable.dirty.ratio", "type": "DOUBLE", "documentation": "This configuration controls how frequently the log compactor will attempt to clean the log (assuming \"log compaction\" is enabled). By default we will avoid cleaning a log where more than 50% of the log has been compacted. This ratio bounds the maximum space wasted in the log by duplicates (at 50% at most 50% of the log could be duplicates). A higher ratio will mean fewer, more efficient cleanings but will mean more wasted space in the log. If the max.compaction.lag.ms or the min.compaction.lag.ms configurations are also specified, then the log compactor considers the log to be eligible for compaction as soon as either: (i) the dirty ratio threshold has been met and the log has had dirty (uncompacted) records for at least the min.compaction.lag.ms duration, or (ii) if the log has had dirty (uncompacted) records for at most the max.compaction.lag.ms period.", - "category": "Storage Performance", + "category": "Compaction", "frontendFormat": "RATIO" }, { "name": "index.interval.bytes", "type": "INT", "documentation": "This setting controls how frequently Kafka adds an index entry to its offset index. The default setting ensures that we index a message roughly every 4096 bytes. More indexing allows reads to jump closer to the exact position in the log but makes the index larger. You probably don't need to change this.", - "category": "Storage Performance", + "category": "Storage Internals", "frontendFormat": "BYTE_SIZE" }, { @@ -151,35 +151,95 @@ "aliases": ["retention_bytes"], "type": "LONG", "documentation": "This configuration controls the maximum size a partition (which consists of log segments) can grow to before we will discard old log segments to free up space if we are using the \"delete\" retention policy. By default there is no size limit only a time limit. Since this limit is enforced at the partition level, multiply it by the number of partitions to compute the topic retention in bytes.", - "category": "Storage", + "category": "Retention", "frontendFormat": "BYTE_SIZE" }, { "name": "delete.retention.ms", "type": "LONG", "documentation": "The amount of time to retain delete tombstone markers for\"log compacted\" topics. This setting also gives a bound on the time in which a consumer must complete a read if they begin from offset 0 to ensure that they get a valid snapshot of the final stage (otherwise delete tombstones may be collected before they complete their scan).", - "category": "Storage", + "category": "Retention", "frontendFormat": "DURATION" }, { "name": "segment.ms", "type": "LONG", "documentation": "This configuration controls the period of time after which Kafka will force the log to roll even if the segment file isn't full to ensure that retention can delete or compact old data.", - "category": "Storage", + "category": "Storage Internals", "frontendFormat": "DURATION" }, { "name": "message.timestamp.difference.max.ms", "type": "LONG", "documentation": "The maximum difference allowed between the timestamp when a broker receives a message and the timestamp specified in the message. If message.timestamp.type=CreateTime, a message will be rejected if the difference in timestamp exceeds this threshold. This configuration is ignored if message.timestamp.type=LogAppendTime.", - "category": "Storage", + "category": "Message Handling", "frontendFormat": "DURATION" }, { "name": "segment.index.bytes", "type": "INT", "documentation": "This configuration controls the size of the index that maps offsets to file positions. We preallocate this index file and shrink it only after log rolls. You generally should not need to change this setting.", - "category": "Storage Performance", + "category": "Storage Internals", "frontendFormat": "BYTE_SIZE" + }, + { + "name": "compression.gzip.level", + "type": "INT", + "documentation": "The compression level to use if compression.type is set to 'gzip'.", + "category": "Compression" + }, + { + "name": "compression.lz4.level", + "type": "INT", + "documentation": "The compression level to use if compression.type is set to 'lz4'.", + "category": "Compression" + }, + { + "name": "compression.zstd.level", + "type": "INT", + "documentation": "The compression level to use if compression.type is set to 'zstd'.", + "category": "Compression" + }, + { + "name": "local.retention.bytes", + "type": "INT", + "documentation": "The maximum size of local log segments that can grow for a partition before it deletes the old segments. Default value is -2, it represents `retention.bytes` value to be used. The effective value should always be less than or equal to `retention.bytes` value.", + "category": "Retention" + }, + { + "name": "local.retention.ms", + "type": "INT", + "documentation": "The number of milliseconds to keep the local log segment before it gets deleted. Default value is -2, it represents `retention.ms` value is to be used. The effective value should always be less than or equal to `retention.ms` value.", + "category": "Retention" + }, + { + "name": "message.timestamp.after.max.ms", + "type": "INT", + "documentation": "This configuration sets the allowable timestamp difference between the message timestamp and the broker's timestamp. The message timestamp can be later than or equal to the broker's timestamp, with the maximum allowable difference determined by the value set in this configuration.", + "category": "Message Handling" + }, + { + "name": "message.timestamp.before.max.ms", + "type": "INT", + "documentation": "This configuration sets the allowable timestamp difference between the broker's timestamp and the message timestamp. The message timestamp can be earlier than or equal to the broker's timestamp, with the maximum allowable difference determined by the value set in this configuration.", + "category": "Message Handling" + }, + { + "name": "remote.log.copy.disable", + "type": "BOOLEAN", + "documentation": "Determines whether tiered data for a topic should become read only, and no more data uploading on a topic.", + "category": "Storage Internals" + }, + { + "name": "remote.log.delete.disable", + "type": "BOOLEAN", + "documentation": "Determines whether tiered data for a topic should be deleted after tiered storage is disabled on a topic. This configuration should be enabled when trying to set `remote.storage.enable` from true to false.", + "category": "Storage Internals" + }, + { + "name": "remote.storage.enable", + "type": "BOOLEAN", + "documentation": "To enable tiered storage for a topic, set this configuration to true. To disable tiered storage for a topic that has it enabled, set this configuration to false. When disabling, you must also set remote.log.delete.on.disable to true.", + "category": "Storage Internals" } ] diff --git a/backend/pkg/embed/kafka/redpanda_configs.json b/backend/pkg/embed/kafka/redpanda_configs.json index 32a76cb015..a70afdb442 100644 --- a/backend/pkg/embed/kafka/redpanda_configs.json +++ b/backend/pkg/embed/kafka/redpanda_configs.json @@ -40,5 +40,131 @@ "documentation": "When a topic is enabled for remote write, retention.ms and retention.bytes specify the retention policy for data in the cloud. Retention.local.target.{ms|bytes} specify the local retention policy in this scenario. If the topic is not enabled for remote write, these options are ignored.", "category": "Tiered Storage", "frontendFormat": "DURATION" + }, + { + "name": "redpanda.iceberg.delete", + "type": "BOOLEAN", + "documentation": "Whether the corresponding Iceberg table is deleted upon deleting the topic.", + "category": "Iceberg" + }, + { + "name": "redpanda.iceberg.invalid.record.action", + "type": "STRING", + "documentation": "Whether to write invalid records to a dead-letter queue (DLQ).", + "category": "Iceberg", + "enumValues": ["drop", "dlq_table"] + }, + { + "name": "redpanda.iceberg.mode", + "type": "STRING", + "documentation": "Enable the Iceberg integration for the topic. You can choose one of four modes.", + "category": "Iceberg", + "enumValues": ["key_value", "value_schema_id_prefix", "value_schema_latest", "disabled"] + }, + { + "name": "redpanda.iceberg.partition.spec", + "type": "INT", + "documentation": "The partitioning specification for the Iceberg table.", + "category": "Iceberg", + "frontendFormat": "DURATION" + }, + { + "name": "redpanda.iceberg.target.lag.ms", + "type": "INT", + "documentation": "Controls how often the data in the Iceberg table is refreshed with new data from the topic. Redpanda attempts to commit all data produced to the topic within the lag target, subject to resource availability.", + "category": "Iceberg" + }, + { + "name": "redpanda.remote.readreplica", + "type": "STRING", + "documentation": "The name of the object storage bucket for a Remote Read Replica topic. Not to be used with redpanda.remote.read or redpanda.remote.write.", + "category": "Tiered Storage" + }, + { + "name": "flush.bytes", + "type": "INT", + "documentation": "The maximum bytes not fsynced per partition. If this configured threshold is reached, the log is automatically fsynced, even though it wasn’t explicitly requested.", + "category": "Write Caching" + }, + { + "name": "initial.retention.local.target.bytes", + "type": "INT", + "documentation": "A size-based initial retention limit for Tiered Storage that determines how much data in local storage is transferred to a partition replica when a cluster is resized. If null (default), all locally retained data is transferred.", + "category": "Tiered Storage" + }, + { + "name": "initial.retention.local.target.ms", + "type": "INT", + "documentation": "A time-based initial retention limit for Tiered Storage that determines how much data in local storage is transferred to a partition replica when a cluster is resized. If null (default), all locally retained data is transferred.", + "category": "Tiered Storage" + }, + { + "name": "redpanda.leaders.preference", + "type": "STRING", + "documentation": "The preferred location (rack) for partition leaders of a topic.", + "category": "Replication" + }, + { + "name": "replication.factor", + "type": "INT", + "documentation": "The number of replicas of a topic to save in different nodes (brokers) of a cluster. If replication.factor is set to a positive value, it overrides the cluster property default_topic_replication for the topic.", + "category": "Replication" + }, + { + "name": "write.caching", + "type": "BOOLEAN", + "documentation": "The write caching mode to apply to a topic.", + "category": "Write Caching" + }, + { + "name": "redpanda.key.schema.id.validation", + "type": "BOOLEAN", + "documentation": "Enable validation of the schema ID for keys on a record. When enabled, Redpanda validates that the schema ID encoded in the record's key is registered in the Schema Registry according to the configured subject name strategy.", + "category": "Schema Registry and Validation" + }, + { + "name": "redpanda.key.subject.name.strategy", + "type": "STRING", + "documentation": "The subject name strategy for keys when `redpanda.key.schema.id.validation` is enabled. This determines how the topic and schema are mapped to a subject name in the Schema Registry.", + "category": "Schema Registry and Validation" + }, + { + "name": "redpanda.value.schema.id.validation", + "type": "BOOLEAN", + "documentation": "Enable validation of the schema ID for values on a record. When enabled, Redpanda validates that the schema ID encoded in the record's value is registered in the Schema Registry according to the configured subject name strategy.", + "category": "Schema Registry and Validation" + }, + { + "name": "redpanda.value.subject.name.strategy", + "type": "STRING", + "documentation": "The subject name strategy for values when `redpanda.value.schema.id.validation` is enabled. This determines how the topic and schema are mapped to a subject name in the Schema Registry.", + "enumValues": ["TopicNameStrategy", "RecordNameStrategy", "TopicRecordNameStrategy"], + "category": "Schema Registry and Validation" + }, + { + "name": "confluent.key.schema.validation", + "type": "BOOLEAN", + "documentation": "Enable validation of the schema ID for keys on a record. This is a compatibility alias for `redpanda.key.schema.id.validation`. When enabled, Redpanda validates that the schema ID encoded in the record's key is registered in the Schema Registry according to the configured subject name strategy.", + "category": "Schema Registry and Validation" + }, + { + "name": "confluent.key.subject.name.strategy", + "type": "STRING", + "documentation": "The subject name strategy for keys when `confluent.key.schema.validation` is enabled. This is a compatibility alias for `redpanda.key.subject.name.strategy`. This determines how the topic and schema are mapped to a subject name in the Schema Registry.", + "enumValues": ["io.confluent.kafka.serializers.subject.TopicNameStrategy", "io.confluent.kafka.serializers.subject.RecordNameStrategy", "io.confluent.kafka.serializers.subject.TopicRecordNameStrategy"], + "category": "Schema Registry and Validation" + }, + { + "name": "confluent.value.schema.validation", + "type": "BOOLEAN", + "documentation": "Enable validation of the schema ID for values on a record. This is a compatibility alias for `redpanda.value.schema.id.validation`. When enabled, Redpanda validates that the schema ID encoded in the record's value is registered in the Schema Registry according to the configured subject name strategy.", + "category": "Schema Registry and Validation" + }, + { + "name": "confluent.value.subject.name.strategy", + "type": "STRING", + "documentation": "The subject name strategy for values when `confluent.value.schema.validation` is enabled. This is a compatibility alias for `redpanda.value.subject.name.strategy`. This determines how the topic and schema are mapped to a subject name in the Schema Registry.", + "enumValues": ["io.confluent.kafka.serializers.subject.TopicNameStrategy", "io.confluent.kafka.serializers.subject.RecordNameStrategy", "io.confluent.kafka.serializers.subject.TopicRecordNameStrategy"], + "category": "Schema Registry and Validation" } -] \ No newline at end of file +] diff --git a/frontend/src/components/pages/topics/TopicConfiguration.test.tsx b/frontend/src/components/pages/topics/TopicConfiguration.test.tsx new file mode 100644 index 0000000000..df32a9aadb --- /dev/null +++ b/frontend/src/components/pages/topics/TopicConfiguration.test.tsx @@ -0,0 +1,55 @@ +import { render, screen } from '@testing-library/react'; +import type { ConfigEntryExtended } from '../../../state/restInterfaces'; +import ConfigurationEditor from './TopicConfiguration'; + +describe('TopicConfiguration', () => { + test('renders groups in the correct order', () => { + // Generate an out of order set of test options + const entries: ConfigEntryExtended[] = [ + 'Retention', + 'Tiered Storage', + 'Storage Internals', + 'Compression', + 'Compaction', + 'Replication', + 'Iceberg', + '', // unknown options should appear at the end as 'Other' + 'Message Handling', + 'Write Caching', + 'Schema Registry and Validation' + ].map((category) => { + return { + name: 'test.option', + category: category, + value: '', + source: '', + type: 'STRING', + isExplicitlySet: false, + isDefaultValue: false, + isReadOnly: false, + isSensitive: false, + synonyms: [], + currentValue: '', + }; + }); + + const { container } = render( { }} />); + expect(screen.getByTestId('config-group-table')).toBeVisible(); + + const groups = container.querySelectorAll('.configGroupTitle'); + + expect([ + 'Retention', + 'Compaction', + 'Replication', + 'Tiered Storage', + 'Write Caching', + 'Iceberg', + 'Schema Registry and Validation', + 'Message Handling', + 'Compression', + 'Storage Internals', + 'Other', + ]).toEqual(Array.from(groups).map((g) => g.textContent)); + }); +}); diff --git a/frontend/src/components/pages/topics/TopicConfiguration.tsx b/frontend/src/components/pages/topics/TopicConfiguration.tsx index 92b9e594b7..e931309a39 100644 --- a/frontend/src/components/pages/topics/TopicConfiguration.tsx +++ b/frontend/src/components/pages/topics/TopicConfiguration.tsx @@ -248,6 +248,22 @@ const ConfigurationEditor: FC = observer((props) => { const categories = entries.groupInto((x) => x.category); for (const e of categories) if (!e.key) e.key = 'Other'; + const displayOrder = [ + 'Retention', + 'Compaction', + 'Replication', + 'Tiered Storage', + 'Write Caching', + 'Iceberg', + 'Schema Registry and Validation', + 'Message Handling', + 'Compression', + 'Storage Internals', + 'Other' + ]; + + categories.sort((a, b) => displayOrder.indexOf(a.key ?? '') - displayOrder.indexOf(b.key ?? '')); + return ( {$state.editedEntry !== null && ( @@ -260,7 +276,7 @@ const ConfigurationEditor: FC = observer((props) => { }} /> )} -
+
{ }) => { const topicName = `too-big-message-test-${randomUUID()}`; - await page.goto('/topics'); - await page.getByTestId('create-topic-button').click(); - await page.getByTestId('topic-name').fill(topicName); - await page.getByTestId('onOk-button').click(); + await createTopic(page, { topicName }); await page.goto(`/topics/${topicName}/produce-record`); // const DefaultMaxDeserializationPayloadSize = 20_480 // 20 KB @@ -50,10 +48,7 @@ test.describe('Topic', () => { state: 'visible', }); - // cleanup, let's delete the topic now - await page.goto('/topics'); - await page.getByTestId(`delete-topic-button-${topicName}`).click(); - await page.getByTestId('delete-topic-confirm-button').click(); + await deleteTopic(page, { topicName }); }); test('should show internal topics if the corresponding checkbox is checked', async ({ page }) => { @@ -68,29 +63,41 @@ test.describe('Topic', () => { await expect(page.getByTestId('data-table-cell').getByText('_schemas')).not.toBeVisible(); }); - test('should create a topic, produce a message, export it as CSV format and delete a topic', async ({ page }) => { - const topicName = `test-topic-${Date.now()}`; + test('should create a topic and properly group the configurations', async ({ page }) => { + const topicName = `test-config-topic-${Date.now()}`; - await page.goto('/topics'); + await createTopic(page, { topicName }); - await test.step('Create topic', async () => { - await page.getByTestId('create-topic-button').click(); - await page.getByTestId('topic-name').fill(topicName); - await page.getByTestId('onOk-button').click(); - await page.getByRole('button', { name: 'Close' }).click(); // Close success dialog - await expect(page.getByRole('link', { name: topicName })).toBeVisible(); - }); + await test.step('Verify configuration grouping', async () => { + await page.goto(`/topics/${topicName}#configuration`) + await expect(page.getByTestId("config-group-table")).toBeVisible(); - await test.step('Produce message', async () => { - await page.goto(`/topics/${topicName}/produce-record`); - const valueMonacoEditor = page.getByTestId('produce-value-editor').locator('.monaco-editor').first(); - await valueMonacoEditor.click(); // Focus the editor - await page.keyboard.insertText('hello world'); - await page.getByTestId('produce-button').click(); - const messageValueCell = page.getByRole('cell', { name: /hello world/i }).first(); - await expect(messageValueCell).toBeVisible(); + // This is the full order we currently expect to see things in + const expected = [ + 'Retention', 'Compaction', 'Replication', 'Tiered Storage', + 'Write Caching', 'Iceberg', 'Schema Registry and Validation', + 'Message Handling', 'Compression', 'Storage Internals' + ]; + + // Grab the actual groups on the page, then grab the intersection + const actual = await page.locator('.configGroupTitle').allTextContents(); + const filtered = actual.filter(t => expected.includes(t)); + const present = expected.filter(t => actual.includes(t)); + + // Make sure the basic options ('Retention') is present, and the rest are in the right order + expect(filtered).toContain('Retention'); + expect(filtered).toEqual(present); }); + await deleteTopic(page, { topicName }); + }); + + test('should create a topic, produce a message, export it as CSV format and delete a topic', async ({ page }) => { + const topicName = `test-topic-${Date.now()}`; + + await createTopic(page, { topicName }); + await produceMessage(page, { topicName, message: 'hello world' }); + await test.step('Export message as CSV', async () => { await page.getByLabel('Collapse row').click(); await page.getByText('Download Record').click(); @@ -106,39 +113,15 @@ test.describe('Topic', () => { fs.unlinkSync(tempFilePath); // Clean up }); - await test.step('Delete topic', async () => { - await page.goto('/topics'); - await expect(page.getByRole('link', { name: topicName })).toBeVisible(); // Re-verify topic before delete - await page.getByTestId(`delete-topic-button-${topicName}`).click(); - await page.getByTestId('delete-topic-confirm-button').click(); - await expect(page.getByText('Topic Deleted')).toBeVisible(); - await expect(page.getByRole('link', { name: topicName })).not.toBeVisible(); - }); + await deleteTopic(page, { topicName }); }); test('should create topic, produce message, copy value to clipboard, and delete topic', async ({ page }) => { const topicName = `test-topic-clipboard-${Date.now()}`; const messageValue = 'hello clipboard test'; - await page.goto('/topics'); - - await test.step('Create topic', async () => { - await page.getByTestId('create-topic-button').click(); - await page.getByTestId('topic-name').fill(topicName); - await page.getByTestId('onOk-button').click(); - await page.getByRole('button', { name: 'Close' }).click(); // Close success dialog - await expect(page.getByRole('link', { name: topicName })).toBeVisible(); - }); - - await test.step('Produce message', async () => { - await page.goto(`/topics/${topicName}/produce-record`); - const valueMonacoEditor = page.getByTestId('produce-value-editor').locator('.monaco-editor').first(); - await valueMonacoEditor.click(); // Focus the editor - await page.keyboard.insertText(messageValue); - await page.getByTestId('produce-button').click(); - const messageValueCell = page.getByRole('cell', { name: new RegExp(messageValue, 'i') }).first(); - await expect(messageValueCell).toBeVisible(); - }); + await createTopic(page, { topicName }); + await produceMessage(page, { topicName, message: messageValue }); await test.step('Copy message value to clipboard', async () => { await page.getByLabel('Collapse row').first().click(); @@ -153,13 +136,6 @@ test.describe('Topic', () => { await expect(page.getByText('Value copied to clipboard')).toBeVisible({ timeout: 2000 }); }); - await test.step('Delete topic', async () => { - await page.goto('/topics'); - await expect(page.getByRole('link', { name: topicName })).toBeVisible(); // Re-verify topic before delete - await page.getByTestId(`delete-topic-button-${topicName}`).click(); - await page.getByTestId('delete-topic-confirm-button').click(); - await expect(page.getByText('Topic Deleted')).toBeVisible(); - await expect(page.getByRole('link', { name: topicName })).not.toBeVisible(); - }); + await deleteTopic(page, { topicName }); }); }); diff --git a/frontend/tests/topic.utils.ts b/frontend/tests/topic.utils.ts new file mode 100644 index 0000000000..21c3dcaa5a --- /dev/null +++ b/frontend/tests/topic.utils.ts @@ -0,0 +1,35 @@ +import { Page, test, expect } from '@playwright/test'; + +export const createTopic = async (page: Page, { topicName }: { topicName: string }) => { + return await test.step('Create topic', async () => { + await page.goto('/topics'); + await page.getByTestId('create-topic-button').click(); + await page.getByTestId('topic-name').fill(topicName); + await page.getByTestId('onOk-button').click(); + await page.getByRole('button', { name: 'Close' }).click(); // Close success dialog + await expect(page.getByRole('link', { name: topicName })).toBeVisible(); + }); +}; + +export const deleteTopic = async (page: Page, { topicName }: { topicName: string }) => { + return await test.step('Delete topic', async () => { + await page.goto('/topics'); + await expect(page.getByRole('link', { name: topicName })).toBeVisible(); // Verify topic exists + await page.getByTestId(`delete-topic-button-${topicName}`).click(); + await page.getByTestId('delete-topic-confirm-button').click(); + await expect(page.getByText('Topic Deleted')).toBeVisible(); + await expect(page.getByRole('link', { name: topicName })).not.toBeVisible(); + }); +}; + +export const produceMessage = async (page: Page, { topicName, message }: { topicName: string; message: string }) => { + return await test.step('Produce message', async () => { + await page.goto(`/topics/${topicName}/produce-record`); + const valueMonacoEditor = page.getByTestId('produce-value-editor').locator('.monaco-editor').first(); + await valueMonacoEditor.click(); // Focus the editor + await page.keyboard.insertText(message); + await page.getByTestId('produce-button').click(); + const messageValueCell = page.getByRole('cell', { name: new RegExp(message, 'i') }).first(); + await expect(messageValueCell).toBeVisible(); + }); +};