@codecademy/codebytes 0.2.1-alpha.ea0d6d.0 → 0.2.1-alpha.f2f3f4.0

package/CHANGELOG.md

@@ -3,7 +3,7 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
-### [0.2.1-alpha.ea0d6d.0](https://github.com/Codecademy/client-modules/compare/@codecademy/codebytes@0.3.0...@codecademy/codebytes@0.2.1-alpha.ea0d6d.0) (2022-01-14)
+### [0.2.1-alpha.f2f3f4.0](https://github.com/Codecademy/client-modules/compare/@codecademy/codebytes@0.3.0...@codecademy/codebytes@0.2.1-alpha.f2f3f4.0) (2022-01-14)
 
 **Note:** Version bump only for package @codecademy/codebytes
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@codecademy/codebytes",
   "description": "Codebytes Code Editor",
-  "version": "0.2.1-alpha.ea0d6d.0",
+  "version": "0.2.1-alpha.f2f3f4.0",
   "author": "Codecademy Engineering <dev@codecademy.com>",
   "sideEffects": [
     "**/*.css",
@@ -51,5 +51,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "0c38f7a667d0ab4f0e11a9a802d03734a932c0ae"
+  "gitHead": "0217221d6e84fc50096aa400141ccaada0da3abf"
 }

package/src/__tests__/codebyte-test.tsx

@@ -68,4 +68,54 @@ describe('CodeBytes', () => {
     });
     view.getByText(testString);
   });
+
+  describe.only('Change Handlers', () => {
+    it('triggers onLogoClick upon clicking the logo', () => {
+      const onLogoClick = jest.fn();
+      const { view } = renderWrapper({
+        on: {
+          logoClick: onLogoClick,
+        },
+      });
+
+      const logo = view.getByLabelText('visit codecademy.com');
+      userEvent.click(logo);
+
+      expect(onLogoClick).toHaveBeenCalled();
+    });
+
+    it('triggers onEdit on text edit', () => {
+      const onEdit = jest.fn();
+      const { view } = renderWrapper({
+        text: '',
+        language: 'javascript',
+        on: {
+          edit: onEdit,
+        },
+      });
+
+      const editor = view.getByTestId(mockEditorTestId);
+      userEvent.type(editor, 'dog');
+
+      expect(onEdit).toHaveBeenCalledTimes(3);
+      expect(onEdit).toHaveBeenLastCalledWith('dog', 'javascript');
+    });
+
+    it('triggers onLanguageChange on language selection', () => {
+      const onLanguageChange = jest.fn();
+      const { view } = renderWrapper({
+        on: {
+          languageChange: onLanguageChange,
+        },
+      });
+
+      const selectedLanguage = view.getByRole('combobox') as Element;
+      userEvent.selectOptions(selectedLanguage, ['javascript']);
+
+      expect(onLanguageChange).toHaveBeenCalledWith(
+        "console.log('Hello world!');",
+        'javascript'
+      );
+    });
+  });
 });

package/src/__tests__/editor-test.tsx

@@ -1,6 +1,7 @@
 import { setupRtl } from '@codecademy/gamut-tests';
 import userEvent from '@testing-library/user-event';
 import React from 'react';
+import { act } from 'react-test-renderer';
 
 import { Editor } from '../editor';
 
@@ -56,4 +57,47 @@ describe('Editor', () => {
 
     view.getByTestId('copy-codebyte-btn');
   });
+
+  describe.only('Change Handlers', () => {
+    it('triggers onCopy upon clicking the copy button', () => {
+      const onCopy = jest.fn();
+      const { view } = renderWrapper({
+        on: {
+          copy: onCopy,
+        },
+      });
+
+      const copyButton = view.getByTestId('copy-codebyte-btn');
+      userEvent.click(copyButton);
+
+      expect(onCopy).toHaveBeenCalled();
+    });
+
+    it('triggers onRun upon clicking the run button', async () => {
+      (global as any).fetch.mockResolvedValue({
+        json: () =>
+          Promise.resolve({
+            stderr: [],
+            exit_code: 0,
+            stdout: '',
+          }),
+      });
+      const onRun = jest.fn();
+      const { view } = renderWrapper({
+        onChange: jest.fn(),
+        text: 'test',
+        language: 'javascript',
+        on: {
+          run: onRun,
+        },
+      });
+
+      const runButton = view.getByText('Run');
+      await act(async () => {
+        userEvent.click(runButton);
+      });
+
+      expect(onRun).toHaveBeenCalled();
+    });
+  });
 });