diff --git a/cypress.config.cjs b/cypress.config.cjs
deleted file mode 100644
index 1bce01860..000000000
--- a/cypress.config.cjs
+++ /dev/null
@@ -1,33 +0,0 @@
-/* eslint-disable @typescript-eslint/no-var-requires */
-const { defineConfig } = require("cypress");
-const { startDevServer } = require('@cypress/vite-dev-server');
-
-module.exports = defineConfig({
- video: false,
- defaultCommandTimeout: 10000,
- e2e: {
- setupNodeEvents(on, config) {
- return require('@cypress/code-coverage/task')(on, config);
- },
- specPattern: 'cypress/e2e/**/*spec.ts',
- baseUrl: 'http://localhost:3000',
- },
- component: {
- devServer({ config, specs, devServerEvents }) {
- return startDevServer({
- options: {
- config,
- specs,
- devServerEvents,
- },
- viteConfig: {
- configFile: "./vite.config.ts",
- logLevel: "silent"
- },
- });
-
- },
- specPattern: 'src/**/*spec.ts',
- indexHtmlFile: './index.html'
- },
-});
diff --git a/cypress.config.ts b/cypress.config.ts
new file mode 100644
index 000000000..269c5694e
--- /dev/null
+++ b/cypress.config.ts
@@ -0,0 +1,17 @@
+import { defineConfig } from "cypress";
+
+export default defineConfig({
+ video: false,
+ defaultCommandTimeout: 10000,
+ e2e: {
+ specPattern: "cypress/e2e/**/*spec.ts",
+ baseUrl: "http://localhost:3000",
+ },
+ component: {
+ devServer: {
+ framework: "svelte",
+ bundler: "vite",
+ },
+ specPattern: "src/**/*spec.ts",
+ },
+});
diff --git a/cypress/support/component-index.html b/cypress/support/component-index.html
new file mode 100644
index 000000000..673d0c126
--- /dev/null
+++ b/cypress/support/component-index.html
@@ -0,0 +1,15 @@
+
+
+
+
-
+
diff --git a/src/Error.spec.ts b/src/Error.spec.ts
index 088e60aeb..71e823479 100644
--- a/src/Error.spec.ts
+++ b/src/Error.spec.ts
@@ -1,11 +1,9 @@
import Error from "./Error.svelte";
-import { render } from "@testing-library/svelte";
import { Failure } from "@app/error";
-import "@public/index.css";
describe("Error", () => {
it("should show passed in props", () => {
- render(Error, {
+ cy.mount(Error, {
props: {
subtitle: "Subtitle of Modal",
error: {
@@ -16,24 +14,24 @@ describe("Error", () => {
},
},
});
- cy.findByText("Error");
- cy.findByText("Subtitle of Modal");
- cy.findByText("Not enough RAD");
- cy.findByText("Back");
+ cy.get("body").contains("Error").should("be.visible");
+ cy.get("body").contains("Subtitle of Modal").should("be.visible");
+ cy.get("body").contains("Not enough RAD").should("be.visible");
+ cy.get("button").contains("Back").should("be.visible");
});
it("should show custom error message", () => {
- render(Error, {
+ cy.mount(Error, {
props: {
subtitle: "Subtitle of Modal",
message: "Error message to check for",
},
});
- cy.findByText("Error message to check for");
+ cy.get("body").contains("Error message to check for").should("be.visible");
});
it("should change button label to Close when floating", () => {
- render(Error, {
+ cy.mount(Error, {
props: {
title: "Title of Modal",
subtitle: "Subtitle of Modal",
@@ -41,6 +39,6 @@ describe("Error", () => {
floating: true,
},
});
- cy.findByText("Close");
+ cy.get("button").contains("Close").should("be.visible");
});
});
diff --git a/src/NotFound.spec.ts b/src/NotFound.spec.ts
index 9402d8a56..18d7a4e32 100644
--- a/src/NotFound.spec.ts
+++ b/src/NotFound.spec.ts
@@ -1,17 +1,17 @@
import NotFound from "./NotFound.svelte";
-import { render } from "@testing-library/svelte";
-import "@public/index.css";
describe("NotFound", () => {
it("shows passed props correctly", () => {
- render(NotFound, {
+ cy.mount(NotFound, {
props: {
title: "nakamoto",
subtitle: "Sorry, the requested project was not found.",
},
});
- cy.findByText("nakamoto");
- cy.findByText("Sorry, the requested project was not found.");
- cy.findByText("Back");
+ cy.get("body").contains("nakamoto").should("be.visible");
+ cy.get("body")
+ .contains("Sorry, the requested project was not found.")
+ .should("be.visible");
+ cy.get("button").contains("Back").should("be.visible");
});
});
diff --git a/src/SeedAddress.spec.ts b/src/SeedAddress.spec.ts
index 1149fcdfb..5e8b04605 100644
--- a/src/SeedAddress.spec.ts
+++ b/src/SeedAddress.spec.ts
@@ -1,39 +1,53 @@
+import { Seed } from "@app/base/seeds/Seed";
+import { getConfig } from "@app/config";
+
import SeedAddress from "./SeedAddress.svelte";
-import { render } from "@testing-library/svelte";
-import "@public/index.css";
describe("SeedAddress", () => {
it("shows the seed emoji and seed host", () => {
- render(SeedAddress, {
- props: {
- seed: {
- id: "hydkkkf5ksbe5fuszdhpqhytu3q36gwagj874wxwpo5a8ti8coygh1",
- emoji: "🐱",
+ getConfig().then(cfg => {
+ const seed = new Seed(
+ {
host: "seed.cloudhead.io",
+ id: "hydkkkf5ksbe5fuszdhpqhytu3q36gwagj874wxwpo5a8ti8coygh1",
},
- port: 8776,
- },
+ cfg,
+ );
+
+ cy.mount(SeedAddress, {
+ props: {
+ seed,
+ port: 8776,
+ },
+ });
+ cy.get("span.seed-icon").should("have.text", "🐱");
+ cy.contains("seed.cloudhead.io")
+ .should("have.attr", "href", "/seeds/seed.cloudhead.io")
+ .should("be.visible");
});
- cy.get("span.seed-icon").should("have.text", "🐱");
- cy.findByText("seed.cloudhead.io")
- .should("have.attr", "href", "/seeds/seed.cloudhead.io")
- .should("be.visible");
});
it("shows the full seed id", () => {
- render(SeedAddress, {
- props: {
- seed: {
- id: "hydkkkf5ksbe5fuszdhpqhytu3q36gwagj874wxwpo5a8ti8coygh1",
- emoji: "🐱",
+ getConfig().then(cfg => {
+ const seed = new Seed(
+ {
host: "seed.cloudhead.io",
+ id: "hydkkkf5ksbe5fuszdhpqhytu3q36gwagj874wxwpo5a8ti8coygh1",
},
- port: 8776,
- full: true,
- },
+ cfg,
+ );
+ cy.mount(SeedAddress, {
+ props: {
+ seed,
+ port: 8776,
+ full: true,
+ },
+ });
+ cy.get("span.seed-icon").should("have.text", "🐱");
+ cy.get("body")
+ .contains("hydkkk…coygh1@seed.cloudhead.io")
+ .should("be.visible");
+ cy.get("body").contains(":8776").should("be.visible");
});
- cy.get("span.seed-icon").should("have.text", "🐱");
- cy.findByText("hydkkk…coygh1@seed.cloudhead.io").should("be.visible");
- cy.findByText(":8776").should("be.visible");
});
});
diff --git a/src/base/projects/BranchSelector.spec.ts b/src/base/projects/BranchSelector.spec.ts
index 1886643fb..9d3e07678 100644
--- a/src/base/projects/BranchSelector.spec.ts
+++ b/src/base/projects/BranchSelector.spec.ts
@@ -1,25 +1,31 @@
+import type { ProjectInfo } from "@app/project";
+
import BranchSelector from "./BranchSelector.svelte";
-import { fireEvent, render } from "@testing-library/svelte";
-import "@public/index.css";
+
+const project: ProjectInfo = {
+ head: "e678629cd37c770c640a2cd997fc76303c815772",
+ urn: "rad:git:hnrkqdpm9ub19oc8dccx44echy76hzfsezyio",
+ name: "nakamoto",
+ description: "Privacy-preserving Bitcoin light-client implementation in Rust",
+ defaultBranch: "master",
+ remotes: ["rad:git:hnrkqdpm9ub19oc8dccx44echy76hzfsezyio"],
+ delegates: [
+ {
+ type: "direct",
+ id: "hyn9diwfnytahjq8u3iw63h9jte1ydcatxax3saymwdxqu1zo645pe",
+ },
+ ],
+};
const defaultProps = {
- project: {
- head: "e678629cd37c770c640a2cd997fc76303c815772",
- urn: "rad:git:hnrkqdpm9ub19oc8dccx44echy76hzfsezyio",
- name: "nakamoto",
- description:
- "Privacy-preserving Bitcoin light-client implementation in Rust",
- defaultBranch: "master",
- maintainers: ["rad:git:hnrkqdpm9ub19oc8dccx44echy76hzfsezyio"],
- delegates: ["hyn9diwfnytahjq8u3iw63h9jte1ydcatxax3saymwdxqu1zo645pe"],
- },
+ project,
branches: { master: "e678629cd37c770c640a2cd997fc76303c815772" },
revision: "e678629cd37c770c640a2cd997fc76303c815772",
};
describe("Logic", () => {
it("should show defaultBranch label and head commit if revision === head", () => {
- const { rerender } = render(BranchSelector, {
+ cy.mount(BranchSelector, {
props: defaultProps,
});
cy.get("div.stat.branch")
@@ -28,9 +34,9 @@ describe("Logic", () => {
cy.get("div.hash.mobile")
.should("be.visible")
.should("have.text", "e678629");
-
- // If project.head is null we should get the head from branches.
- rerender({
+ });
+ it("if project.head is null we should get the head from branches", () => {
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
project: {
@@ -54,7 +60,7 @@ describe("Logic", () => {
});
it("should show the branch dropdown if branches available", () => {
- render(BranchSelector, {
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
branches: {
@@ -76,7 +82,7 @@ describe("Logic", () => {
});
it("should show feature-branch label and head commit, if branch label is passed as revision", () => {
- render(BranchSelector, {
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
branches: {
@@ -96,7 +102,7 @@ describe("Logic", () => {
});
it("should show only commit if no branchLabel nor branches are available", () => {
- render(BranchSelector, {
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
revision: "debf82ef3623ec11751a993bda85bac2ff1c6f00",
@@ -113,7 +119,7 @@ describe("Logic", () => {
});
it("should show only commit if branches are available but no branchLabel", () => {
- render(BranchSelector, {
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
revision: "debf82ef3623ec11751a993bda85bac2ff1c6f00",
@@ -129,7 +135,7 @@ describe("Logic", () => {
});
it("should show defaultBranch label if revision === head", () => {
- render(BranchSelector, {
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
revision: "e678629cd37c770c640a2cd997fc76303c815772",
@@ -144,7 +150,7 @@ describe("Logic", () => {
describe("Layout", () => {
it("should show shortened commit when on mobile, and full hash when on desktop", () => {
- render(BranchSelector, {
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
revision: "e678629cd37c770c640a2cd997fc76303c815772",
@@ -161,7 +167,9 @@ describe("Layout", () => {
describe("Events", () => {
it("should dispatch a 'branchChanged' event on click", () => {
- const { getByText, component } = render(BranchSelector, {
+ const branchChangedSpy = cy.spy().as("branchChangedSpy");
+
+ cy.mount(BranchSelector, {
props: {
...defaultProps,
revision: "feature-branch",
@@ -170,18 +178,12 @@ describe("Events", () => {
xyz: "debf82ef3623ec11751a993bda85bac2ff1c6f00",
},
},
+ }).then(({ component }) => {
+ component.$on("branchChanged", branchChangedSpy);
});
- cy.get("div.commit div.stat.branch")
- .click()
- .then(() => {
- const branchLabel = getByText("xyz");
-
- const mock = cy.spy();
- component.$on("branchChanged", mock);
-
- fireEvent.click(branchLabel);
- expect(mock).to.have.been.calledOnce;
- });
+ cy.get("body").contains("feature-branch").click();
+ cy.get("body").contains("xyz").click();
+ cy.get("@branchChangedSpy").should("have.been.called");
});
});
diff --git a/src/base/projects/PeerSelector.spec.ts b/src/base/projects/PeerSelector.spec.ts
index 269528f68..0a03c6984 100644
--- a/src/base/projects/PeerSelector.spec.ts
+++ b/src/base/projects/PeerSelector.spec.ts
@@ -1,6 +1,4 @@
import PeerSelector from "./PeerSelector.svelte";
-import { fireEvent, render } from "@testing-library/svelte";
-import "@public/index.css";
const defaultProps = {
peer: "hyyg555wwkkutaysg6yr67qnu5d5ji54iur3n5uzzszndh8dp7ofue",
@@ -15,7 +13,7 @@ const defaultProps = {
describe("Logic", () => {
it("show delegate name and badge", () => {
- render(PeerSelector, {
+ cy.mount(PeerSelector, {
props: defaultProps,
});
cy.get("span.peer-id").should("have.text", "sebastinez");
@@ -23,7 +21,7 @@ describe("Logic", () => {
});
it("show peer id with badge if no name available", () => {
- render(PeerSelector, {
+ cy.mount(PeerSelector, {
props: {
...defaultProps,
peers: [
@@ -39,12 +37,13 @@ describe("Logic", () => {
});
it("show only peer id if no additional data available", () => {
- render(PeerSelector, {
+ cy.mount(PeerSelector, {
props: {
...defaultProps,
peers: [
{
id: "hyyg555wwkkutaysg6yr67qnu5d5ji54iur3n5uzzszndh8dp7ofue",
+ delegate: false,
},
],
},
@@ -55,7 +54,7 @@ describe("Logic", () => {
describe("Layout", () => {
it("should highlight the current peer", () => {
- render(PeerSelector, {
+ cy.mount(PeerSelector, {
props: { ...defaultProps },
});
cy.get("div.selector").click();
@@ -65,8 +64,9 @@ describe("Layout", () => {
describe("Events", () => {
it("dispatch peerChanged event if clicking on a peer", () => {
- cy.viewport("macbook-13");
- const { getByText, component } = render(PeerSelector, {
+ const peerChangedSpy = cy.spy().as("peerChangedSpy");
+
+ cy.mount(PeerSelector, {
props: {
...defaultProps,
peers: [
@@ -82,17 +82,12 @@ describe("Events", () => {
},
],
},
+ }).then(({ component }) => {
+ component.$on("peerChanged", peerChangedSpy);
});
- cy.get("div.selector")
- .click()
- .then(() => {
- const peer = getByText("cloudhead");
- const mock = cy.spy();
- component.$on("peerChanged", mock);
-
- fireEvent.click(peer);
- expect(mock).to.have.been.calledOnce;
- });
+ cy.get("body").contains("sebastinez").click();
+ cy.get("body").contains("cloudhead").click();
+ cy.get("@peerChangedSpy").should("have.been.called");
});
});
diff --git a/src/base/registrations/Submit.svelte b/src/base/registrations/Submit.svelte
index 3e693ae87..4b7db1a39 100644
--- a/src/base/registrations/Submit.svelte
+++ b/src/base/registrations/Submit.svelte
@@ -34,6 +34,11 @@
error = e;
}
});
+
+ let latestBlock: number;
+ config.provider.on("block", (block: number) => {
+ latestBlock = block;
+ });