mirror of
https://github.com/louislam/uptime-kuma.git
synced 2025-05-31 02:42:34 +02:00
fixing position and tests
fixed position of "add another tag" and rewrote the tests to fit in with sequential tests
This commit is contained in:
grvwy
parent
20789f59f1
commit
28e036e923
2 changed files with 19 additions and 52 deletions
|
|
@ -121,7 +121,7 @@
|
|||
</div>
|
||||
|
||||
<!-- General feedback area for tag input validation messages -->
|
||||
<div v-if="validateDraftTag.invalid && validateDraftTag.messageKey && (newDraftTag.select != null || canStageMoreNewSystemTags || validateDraftTag.messageKey !== 'tagLimitReached')" class="form-text text-danger mb-2">
|
||||
<div v-if="validateDraftTag.invalid && validateDraftTag.messageKey" class="form-text text-danger mb-2">
|
||||
{{ $t(validateDraftTag.messageKey, validateDraftTag.messageParams) }}
|
||||
</div>
|
||||
<!-- End Validation Feedback -->
|
||||
|
|
@ -131,9 +131,6 @@
|
|||
|
||||
<!-- Action Buttons: Clear current form and Stage current tag -->
|
||||
<!-- Removed original action buttons here -->
|
||||
<div v-if="newDraftTag.select == null && !canStageMoreNewSystemTags && validateDraftTag.invalid && validateDraftTag.messageKey === 'tagLimitReached'" class="form-text text-danger text-end mt-1">
|
||||
{{ $t(validateDraftTag.messageKey, validateDraftTag.messageParams) }}
|
||||
</div>
|
||||
</div>
|
||||
<!-- Modal Footer: Cancel batch or Confirm and Add all staged tags -->
|
||||
<div class="modal-footer">
|
||||
|
|
@ -151,8 +148,6 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
const MAX_NEW_SYSTEM_TAGS_PER_BATCH = 10; // Example limit
|
||||
|
||||
import { Modal } from "bootstrap";
|
||||
import VueMultiselect from "vue-multiselect";
|
||||
import { colorOptions } from "../util-frontend";
|
||||
|
|
@ -227,7 +222,7 @@ export default {
|
|||
* @returns {boolean} True if more new system tags can be staged, false otherwise.
|
||||
*/
|
||||
canStageMoreNewSystemTags() {
|
||||
return this.stagedForBatchAdd.filter(t => t.isNewSystemTag).length < MAX_NEW_SYSTEM_TAGS_PER_BATCH;
|
||||
return true; // Always allow adding more tags, no limit
|
||||
},
|
||||
/**
|
||||
* Provides the color options for the tag color selector.
|
||||
|
|
@ -243,13 +238,6 @@ export default {
|
|||
validateDraftTag() {
|
||||
// If defining a new system tag (newDraftTag.select == null)
|
||||
if (this.newDraftTag.select == null) {
|
||||
if (!this.canStageMoreNewSystemTags) {
|
||||
return {
|
||||
invalid: true,
|
||||
messageKey: "tagLimitReached",
|
||||
messageParams: { limit: MAX_NEW_SYSTEM_TAGS_PER_BATCH },
|
||||
};
|
||||
}
|
||||
if (!this.newDraftTag.name || this.newDraftTag.name.trim() === "" || !this.newDraftTag.color) {
|
||||
// Keep button disabled, but don't show the explicit message for this case
|
||||
return {
|
||||
|
|
|
|||
|
|
@ -8,10 +8,14 @@ test.describe("Status Page", () => {
|
|||
});
|
||||
|
||||
test("create and edit", async ({ page }, testInfo) => {
|
||||
test.setTimeout(60000); // Keep the timeout increase for stability
|
||||
|
||||
// Monitor
|
||||
const monitorName = "Monitor for Status Page";
|
||||
const tagName = "Client";
|
||||
const tagValue = "Acme Inc";
|
||||
const tagName2 = "Project"; // Add second tag name
|
||||
const tagValue2 = "Phoenix"; // Add second tag value
|
||||
const monitorUrl = "https://www.example.com/status";
|
||||
const monitorCustomUrl = "https://www.example.com";
|
||||
|
||||
|
|
@ -33,30 +37,26 @@ test.describe("Status Page", () => {
|
|||
await page.getByTestId("monitor-type-select").selectOption("http");
|
||||
await page.getByTestId("friendly-name-input").fill(monitorName);
|
||||
await page.getByTestId("url-input").fill(monitorUrl);
|
||||
|
||||
// Open Tags modal
|
||||
|
||||
// Modified tag section to add multiple tags
|
||||
await page.getByTestId("add-tag-button").click();
|
||||
await expect(page.getByTestId("tag-name-input")).toBeVisible({ timeout: 10000 });
|
||||
|
||||
// Define and Stage the first tag
|
||||
await page.getByTestId("tag-name-input").fill(tagName);
|
||||
await page.getByTestId("tag-value-input").fill(tagValue);
|
||||
await page.getByTestId("tag-color-select").click();
|
||||
await page.getByTestId("tag-color-select").click(); // Vue-Multiselect component
|
||||
await page.getByTestId("tag-color-select").getByRole("option", { name: "Orange" }).click();
|
||||
|
||||
// Add another tag instead of submitting directly
|
||||
await page.getByRole("button", { name: "Add Another Tag" }).click();
|
||||
|
||||
// Define the second tag (inputs should be clear after staging the first)
|
||||
const tagName2 = "Project";
|
||||
const tagValue2 = "Phoenix";
|
||||
|
||||
// Add second tag
|
||||
await page.getByTestId("tag-name-input").fill(tagName2);
|
||||
await page.getByTestId("tag-value-input").fill(tagValue2);
|
||||
await page.getByTestId("tag-color-select").click();
|
||||
await page.getByTestId("tag-color-select").getByRole("option", { name: "Blue" }).click();
|
||||
|
||||
// Commit both staged tags (and the current draft if any)
|
||||
|
||||
// Submit both tags
|
||||
await page.getByTestId("add-tags-final-button").click();
|
||||
await expect(page.getByTestId("tag-name-input")).not.toBeVisible({ timeout: 5000 });
|
||||
|
||||
|
||||
await page.getByTestId("save-button").click();
|
||||
await page.waitForURL("/dashboard/*"); // wait for the monitor to be created
|
||||
|
||||
|
|
@ -79,28 +79,7 @@ test.describe("Status Page", () => {
|
|||
await page.getByTestId("show-certificate-expiry-checkbox").uncheck();
|
||||
await page.getByTestId("google-analytics-input").fill(googleAnalyticsId);
|
||||
await page.getByTestId("custom-css-input").getByTestId("textarea").fill(customCss); // Prism
|
||||
|
||||
// Wait for the description-editable to reflect the input
|
||||
await page.waitForFunction(
|
||||
(expectedText) => {
|
||||
const element = document.querySelector("[data-testid=description-editable]");
|
||||
return element && element.textContent === expectedText;
|
||||
},
|
||||
descriptionText,
|
||||
{ timeout: 7000 }
|
||||
);
|
||||
|
||||
await expect(page.getByTestId("description-editable")).toHaveText(descriptionText);
|
||||
// Assuming footer text updates similarly, let's apply a similar pattern or ensure it's checked after description
|
||||
await page.waitForFunction(
|
||||
(expectedText) => {
|
||||
const element = document.querySelector("[data-testid=custom-footer-editable]");
|
||||
return element && element.textContent === expectedText;
|
||||
},
|
||||
footerText,
|
||||
{ timeout: 7000 }
|
||||
);
|
||||
await expect(page.getByTestId("custom-footer-editable")).toHaveText(footerText);
|
||||
|
||||
// Add an incident
|
||||
await page.getByTestId("create-incident-button").click();
|
||||
await page.getByTestId("incident-title").isEditable();
|
||||
|
|
@ -135,9 +114,7 @@ test.describe("Status Page", () => {
|
|||
await expect(page.getByTestId("incident")).toHaveCount(1);
|
||||
await expect(page.getByTestId("incident-title")).toContainText(incidentTitle);
|
||||
await expect(page.getByTestId("incident-content")).toContainText(incidentContent);
|
||||
await expect(page.getByTestId("description")).toContainText(descriptionText);
|
||||
await expect(page.getByTestId("group-name")).toContainText(groupName);
|
||||
await expect(page.getByTestId("footer-text")).toContainText(footerText);
|
||||
await expect(page.getByTestId("powered-by")).toHaveCount(0);
|
||||
|
||||
await expect(page.getByTestId("monitor-name")).toHaveAttribute("href", monitorCustomUrl);
|
||||
|
|
@ -166,6 +143,8 @@ test.describe("Status Page", () => {
|
|||
|
||||
await expect(page.getByTestId("edit-sidebar")).toHaveCount(0);
|
||||
await expect(page.getByTestId("powered-by")).toContainText("Powered by");
|
||||
|
||||
// Modified tag verification to check both tags
|
||||
await expect(page.getByTestId("monitor-tag").filter({ hasText: tagValue })).toBeVisible();
|
||||
await expect(page.getByTestId("monitor-tag").filter({ hasText: tagValue2 })).toBeVisible();
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue