DEV: Use Ember QUnit to perform the plugin smoke test
This commit is contained in:
Sérgio Saquetim
parent
e6fdfcdcd2
commit
2ac87fe8a7
|
|
@ -47,6 +47,7 @@ export function createData(store) {
|
|||
website_name: "My Website is Discourse",
|
||||
location: "Toronto",
|
||||
suspend_reason: "Some reason",
|
||||
suspended_till: moment().add(30, "days"),
|
||||
groups: [{ name: "Group 1" }, { name: "Group 2" }],
|
||||
created_at: moment().subtract(10, "days"),
|
||||
last_posted_at: moment().subtract(3, "days"),
|
||||
|
|
@ -288,7 +289,7 @@ export function createData(store) {
|
|||
|
||||
toggleSwitchState: true,
|
||||
|
||||
navItems: ["latest", "categories", "top"].map((name) => {
|
||||
navItems: ["latest", "categories", "hot"].map((name) => {
|
||||
let item = NavItem.fromText(name);
|
||||
|
||||
// item.set("href", "#");
|
||||
|
|
|
|||
|
|
@ -1,134 +0,0 @@
|
|||
# frozen_string_literal: true
|
||||
|
||||
require "rails_helper"
|
||||
|
||||
RSpec.describe "Styleguide Smoke Test", type: :system do
|
||||
fab!(:admin)
|
||||
|
||||
# keep this hash updated when adding, removing or renaming components
|
||||
sections = {
|
||||
"SYNTAX" => [{ href: "/syntax/bem", title: "BEM" }],
|
||||
"ATOMS" => [
|
||||
{ href: "/atoms/typography", title: "Typography" },
|
||||
{ href: "/atoms/font-scale", title: "Font System" },
|
||||
{ href: "/atoms/buttons", title: "Buttons" },
|
||||
{ href: "/atoms/colors", title: "Colors" },
|
||||
{ href: "/atoms/icons", title: "Icons" },
|
||||
{ href: "/atoms/forms", title: "Forms" },
|
||||
{ href: "/atoms/spinners", title: "Spinners" },
|
||||
{ href: "/atoms/date-time-inputs", title: "Date/Time inputs" },
|
||||
{ href: "/atoms/dropdowns", title: "Dropdowns" },
|
||||
{ href: "/atoms/topic-link", title: "Topic Link" },
|
||||
{ href: "/atoms/topic-statuses", title: "Topic Statuses" },
|
||||
],
|
||||
"MOLECULES" => [
|
||||
{ href: "/molecules/bread-crumbs", title: "Bread Crumbs" },
|
||||
{ href: "/molecules/categories", title: "Categories" },
|
||||
{ href: "/molecules/char-counter", title: "Character Counter" },
|
||||
{ href: "/molecules/empty-state", title: "Empty State" },
|
||||
{ href: "/molecules/footer-message", title: "Footer Message" },
|
||||
{ href: "/molecules/menus", title: "Menus" },
|
||||
{ href: "/molecules/navigation-bar", title: "Navigation Bar" },
|
||||
{ href: "/molecules/navigation-stacked", title: "Navigation Stacked" },
|
||||
{ href: "/molecules/post-menu", title: "Post Menu" },
|
||||
{ href: "/molecules/signup-cta", title: "Signup CTA" },
|
||||
{ href: "/molecules/toasts", title: "Toasts" },
|
||||
{ href: "/molecules/tooltips", title: "Tooltips" },
|
||||
{ href: "/molecules/topic-list-item", title: "Topic List Item" },
|
||||
{ href: "/molecules/topic-notifications", title: "Topic Notifications" },
|
||||
{ href: "/molecules/topic-timer-info", title: "Topic Timers" },
|
||||
],
|
||||
"ORGANISMS" => [
|
||||
{ href: "/organisms/post", title: "Post" },
|
||||
{ href: "/organisms/topic-map", title: "Topic Map" },
|
||||
{ href: "/organisms/topic-footer-buttons", title: "Topic Footer Buttons" },
|
||||
{ href: "/organisms/topic-list", title: "Topic List" },
|
||||
{ href: "/organisms/basic-topic-list", title: "Basic Topic List" },
|
||||
{ href: "/organisms/categories-list", title: "Categories List" },
|
||||
{ href: "/organisms/chat", title: "Chat" },
|
||||
{ href: "/organisms/modal", title: "Modal" },
|
||||
{ href: "/organisms/navigation", title: "Navigation" },
|
||||
{ href: "/organisms/site-header", title: "Site Header" },
|
||||
{ href: "/organisms/suggested-topics", title: "Suggested Topics" },
|
||||
{ href: "/organisms/user-about", title: "User About Box" },
|
||||
],
|
||||
}
|
||||
|
||||
before do
|
||||
SiteSetting.styleguide_enabled = true
|
||||
sign_in(admin)
|
||||
end
|
||||
|
||||
# this test will check if the index page is rendering correctly and also ensures that all component pages are
|
||||
# declared in the sections hash above
|
||||
it "renders the index page correctly and collect information about the available page" do
|
||||
visit "/styleguide"
|
||||
expect(page).to have_css(".styleguide-contents h1.section-title", text: "Styleguide")
|
||||
|
||||
existing_sections = {}
|
||||
page
|
||||
.all(".styleguide-menu > ul")
|
||||
.each do |section_node|
|
||||
section = section_node.find(".styleguide-heading").text.strip
|
||||
|
||||
existing_sections[section] ||= []
|
||||
items = existing_sections[section]
|
||||
|
||||
anchors = section_node.all("li a")
|
||||
anchors.each { |anchor| items << { title: anchor.text.strip, href: anchor[:href] } }
|
||||
end
|
||||
|
||||
expect(existing_sections.keys).to match_array(sections.keys)
|
||||
|
||||
sections.each do |section, items|
|
||||
items.each do |item|
|
||||
existing_items = existing_sections[section]
|
||||
existing_item = existing_items.find { |i| i[:title] == item[:title] }
|
||||
|
||||
expect(existing_item).not_to be_nil,
|
||||
"Item #{item[:title]} not declared in section #{section}"
|
||||
expect(existing_item[:href]).to end_with(item[:href])
|
||||
|
||||
expect(existing_items.size).to eq(items.size),
|
||||
"Section #{section} has a different number of items declared then what was found in the index page"
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
# uses the sections hash to generate a test for each page and check if it renders correctly
|
||||
context "when testing the available pages" do
|
||||
before do
|
||||
SiteSetting.styleguide_enabled = true
|
||||
sign_in(admin)
|
||||
end
|
||||
|
||||
sections.each do |section, items|
|
||||
items.each do |item|
|
||||
xit "renders the #{section}: #{item[:title]} page correctly" do
|
||||
visit "/styleguide/#{item[:href]}"
|
||||
|
||||
errors =
|
||||
page
|
||||
.driver
|
||||
.browser
|
||||
.logs
|
||||
.get(:browser)
|
||||
.select { |log| log.level == "SEVERE" }
|
||||
.reject do |error|
|
||||
["Failed to load resource", "Manifest", "PresenceChannelNotFound"].any? do |msg|
|
||||
error.message.include?(msg)
|
||||
end
|
||||
end
|
||||
|
||||
if errors.present?
|
||||
errors.each do |error|
|
||||
expect(error.message).to be_nil, "smoke test failed with error: #{error.message}"
|
||||
end
|
||||
end
|
||||
|
||||
expect(page).to have_css(".styleguide-contents h1.section-title", text: item[:title])
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
|
|
@ -0,0 +1,73 @@
|
|||
import { click, findAll, visit } from "@ember/test-helpers";
|
||||
import { test } from "qunit";
|
||||
import { acceptance, query } from "discourse/tests/helpers/qunit-helpers";
|
||||
|
||||
acceptance("Styleguide Smoke Test", function (needs) {
|
||||
needs.settings({ chat_enabled: true });
|
||||
needs.user({
|
||||
admin: true,
|
||||
user_option: {
|
||||
chat_enabled: true,
|
||||
},
|
||||
});
|
||||
|
||||
test("renders the index page correctly and collects information about the available pages", async function (assert) {
|
||||
await visit("/styleguide");
|
||||
assert.dom(".styleguide-contents h1.section-title").hasText("Styleguide");
|
||||
|
||||
const existingSections = {};
|
||||
const sectionNodes = findAll(".styleguide-menu > ul");
|
||||
|
||||
sectionNodes.forEach((sectionNode) => {
|
||||
const section = sectionNode
|
||||
.querySelector(".styleguide-heading")
|
||||
.textContent.trim();
|
||||
existingSections[section] = [];
|
||||
const anchors = sectionNode.querySelectorAll("li a");
|
||||
|
||||
anchors.forEach((anchor) => {
|
||||
existingSections[section].push({
|
||||
title: anchor.textContent.trim(),
|
||||
href: anchor.getAttribute("href"),
|
||||
anchor,
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
let oldHeading = null,
|
||||
oldSection = null;
|
||||
|
||||
for (const [section, items] of Object.entries(existingSections)) {
|
||||
for (const item of items) {
|
||||
await click(item.anchor);
|
||||
|
||||
const heading = query(
|
||||
".styleguide-contents h1.section-title"
|
||||
).textContent.trim();
|
||||
const headingWasUpdated = oldHeading !== heading;
|
||||
|
||||
assert.ok(
|
||||
heading === item.title,
|
||||
`Page was updated to ${section} > ${item.title}` +
|
||||
(headingWasUpdated
|
||||
? ""
|
||||
: ` (The error is probably located in ${oldSection} > ${oldHeading})`)
|
||||
);
|
||||
|
||||
if (headingWasUpdated) {
|
||||
oldHeading = item.title;
|
||||
oldSection = section;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Return to the index page to test if the application is able to navigate away from the last component
|
||||
await visit("/styleguide");
|
||||
assert
|
||||
.dom(".styleguide-contents h1.section-title")
|
||||
.hasText(
|
||||
"Styleguide",
|
||||
`Navigated back to the home page from ${oldSection} > ${oldHeading}`
|
||||
);
|
||||
});
|
||||
});
|
||||
Loading…
Reference in New Issue