cypress-ct-octane-js 0.1.32 → 0.1.34

package/README.md

@@ -1,4 +1,4 @@
-<div><a href="https://octanejs.dev/">Octane</a> framework definition and mount adapter for <a href="https://docs.cypress.io/app/component-testing/">component testing</a> with <a href="https://www.cypress.io/">Cypress</a></div>
+<a href="https://octanejs.dev/">Octane</a> framework definition and mount adapter for <a href="https://docs.cypress.io/app/component-testing/">component testing</a> with <a href="https://www.cypress.io/">Cypress</a>
 
 ## Installation
 
@@ -20,13 +20,55 @@ pnpm add cypress-ct-octane-js
 npm cypress-ct-octane-js
 ```
 
+## Configuration
+
+Add `cypress-ct-octane-js` framework to your `cypress.config.{ts,js}` file
+
+```ts
+export default defineConfig({
+  component: {
+    devServer: {
+      framework: "cypress-ct-octane-js",
+      bundler: "vite",
+      //...more config if necessary
+    },
+  },
+});
+```
+
+If you use Typescript, you may get a type error when setting the framework property. To fix it, type cast the property to `any` like this:
+
+```ts
+framework: 'cypress-ct-octane-js' as any,
+```
+
+## Adding mount command
+
+Add the following lines to your `component.ts` in the `cypress` directory.
+
+```ts
+import { mount } from "cypress-ct-octane-js";
+
+declare global {
+  namespace Cypress {
+    interface Chainable {
+      mount: typeof mount;
+    }
+  }
+}
+
+Cypress.Commands.add("mount", mount);
+```
+
 ## Usage example
 
+You can now use the `cy.mount` function to mount octane components in Cypress.
+
 ```javascript
-import { mount } from "cypress-ct-octane-js";
+import { Greeting } from "my-octane-components";
 
-it("example test", () => {
-  mount(<>Hello World!</>);
+it("should display 'Hello World'", () => {
+  cy.mount(<Greeting text="Hello World!" />);
   cy.contains("Hello World!").should("be.visible");
 });
 ```

package/dist/index.js

@@ -1,19 +1,22 @@
 import { getContainerEl, setupHooks } from "@cypress/mount-utils";
 import { createRoot } from "octane";
+let isLogEnabled = false;
 let dispose;
 function cleanup() {
-    Cypress.log({
-        name: "unmount",
-        message: "Unmounted component",
-    });
+    if (isLogEnabled !== false) {
+        Cypress.log({
+            name: "unmount",
+            message: "Unmounted component",
+        });
+    }
     dispose === null || dispose === void 0 ? void 0 : dispose();
 }
 export function mount(component, options = {}) {
+    isLogEnabled = options.log;
     const container = getContainerEl();
     if (!container) {
         throw new Error("'root' element not found");
     }
-    console.log(container.innerHTML);
     const root = createRoot(container);
     dispose = root.unmount;
     root.render(component);

package/package.json

@@ -1,8 +1,9 @@
 {
   "name": "cypress-ct-octane-js",
-  "version": "0.1.32",
+  "version": "0.1.34",
   "description": "Octane framework definition and mount adapter for Cypress component testing",
   "keywords": [
+    "component-testing",
     "cypress",
     "octane",
     "testing"