{"id":281769,"date":"2019-01-25T11:47:52","date_gmt":"2019-01-25T18:47:52","guid":{"rendered":"http:\/\/css-tricks.com\/?p=281769"},"modified":"2019-01-25T11:47:52","modified_gmt":"2019-01-25T18:47:52","slug":"need-to-test-api-endpoints-two-quick-ways-to-do-it","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/need-to-test-api-endpoints-two-quick-ways-to-do-it\/","title":{"rendered":"Need to Test API Endpoints? Two Quick Ways to Do It."},"content":{"rendered":"

Here’s a possibility! Perhaps you are testing your JavaScript with a framework like Jasmine<\/a>. That’s nice because you can write lots of tests to cover your application, get a nice little UI to see the output, and even integrate it with build and deploy tools to make your ongoing development work safer.<\/p>\n

Now, perhaps there is this zany developer on your team who keeps changing API endpoints on you — quite literally breaking things in the process. You decide to write a test that hits those endpoints and makes sure you’re getting back from it what you expect. Straightforward enough. The only slightly tricky part is that API requests are async. To really test it, the test needs to have some way to wait for the results before testing the expectations. <\/p>\n

<\/p>\n

That can be handled in Jasmine through a beforeEach()<\/code>, which can wait to complete until you call a done()<\/code> function. Here’s the whole thing:<\/p>\n

\n See the Pen
\n Test Endpoint with Jasmine<\/a> by Chris Coyier (
@chriscoyier<\/a>)
\n on
CodePen<\/a>.<\/span>\n<\/p>\n

Here’s largely the same thing but with Mocha\/Chai<\/a>:<\/p>\n

\n See the Pen
\n Test Endpoint with Mocha\/Chai<\/a> by Chris Coyier (
@chriscoyier<\/a>)
\n on
CodePen<\/a>.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"

Here’s a possibility! Perhaps you are testing your JavaScript with a framework like Jasmine. That’s nice because you can write lots of tests to cover your application, get a nice little UI to see the output, and even integrate it with build and deploy tools to make your ongoing development work safer. Now, perhaps there […]<\/p>\n","protected":false},"author":3,"featured_media":281804,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"Say there's a developer on your team who keeps switching API endpoints. Here are two ways to test the data you get back, accounting for async.","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":[]},"categories":[4],"tags":[667],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/01\/michelango-creation.png?fit=1200%2C600&ssl=1","jetpack-related-posts":[],"featured_media_src_url":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2019\/01\/michelango-creation.png?fit=1024%2C512&ssl=1","_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/281769"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=281769"}],"version-history":[{"count":3,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/281769\/revisions"}],"predecessor-version":[{"id":281773,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/281769\/revisions\/281773"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media\/281804"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=281769"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=281769"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=281769"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}