質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

Q&A

解決済

1回答

1536閲覧

ReactのマニュアルにあるJestのテストでSyntaxErrorが出てしまいます

退会済みユーザー

退会済みユーザー

総合スコア0

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

React.js

Reactは、アプリケーションのインターフェースを構築するためのオープンソースJavaScriptライブラリです。

0グッド

0クリップ

投稿2020/04/25 03:08

発生しているエラー

SyntaxError: パス_tests_\hello.test.js: Unexpected token (23:11)

21 | it("renders with or without a name", () => { 22 | act(() => { > 23 | render(<Hello />, container); | ^ 24 | }); 25 | expect(container.textContent).toBe("Hey, stranger"); 26 |

マニュアルのテストです。

ソースコードは一度エラーが出てからはコピポしています。

import React from "react"; export default function Hello(props) { if (props.name) { return <h1>Hello, {props.name}!</h1>; } else { return <span>Hey, stranger</span>; } }
import React from "react"; import { render, unmountComponentAtNode } from "react-dom"; import { act } from "react-dom/test-utils"; import Hello from "./hello"; let container = null; beforeEach(() => { // setup a DOM element as a render target container = document.createElement("div"); document.body.appendChild(container); }); afterEach(() => { // cleanup on exiting unmountComponentAtNode(container); container.remove(); container = null; }); it("renders with or without a name", () => { act(() => { render(<Hello />, container); }); expect(container.textContent).toBe("Hey, stranger"); act(() => { render(<Hello name="Jenny" />, container); }); expect(container.textContent).toBe("Hello, Jenny!"); act(() => { render(<Hello name="Margaret" />, container); }); expect(container.textContent).toBe("Hello, Margaret!"); });

二週間ほど前に一度Jestの勉強をしたのですが、その時は問題なく動作しました。
しかし新たにcreate-react-appでプロジェクトを開始し、Jestの勉強をもう一度しようとテストを試してみた所、エラーが発生しました。
Jestのバージョンは25.4.0です。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

babel.config.jsを用意するといいそうです。

module.exports = { presets: ["@babel/preset-env", "@babel/preset-typescript"] };

これで一応テストが動きました。

投稿2020/04/25 08:56

退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問