{"id":53,"date":"2016-11-21T01:15:42","date_gmt":"2016-11-20T22:15:42","guid":{"rendered":"http:\/\/iamakulov.com\/notes2\/?p=53"},"modified":"2017-05-06T02:27:02","modified_gmt":"2017-05-05T23:27:02","slug":"install-google-chrome-on-travis","status":"publish","type":"post","link":"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/","title":{"rendered":"How to install Google Chrome on Travis (in a container-based environment)"},"content":{"rendered":"<p><em>Updated 22 Jan 2017: removed the \u201caddons.apt.sources\u201d because looks like the google-chrome source is now provided by default.<\/em><\/p>\n<p>Here\u2019s the code. Scroll down for more details:<\/p>\n<pre><code class=\"text\">dist: trusty\nsudo: false\n\naddons:\n  apt:\n    packages:\n      - google-chrome-stable\n\nbefore_script:\n  - export DISPLAY=:99.0\n  - sh -e \/etc\/init.d\/xvfb start &amp;\n  - sleep 3\n<\/code><\/pre>\n<h1 id=\"whats-this\">What\u2019s this<a href=\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/#whats-this\" class=\"heading-link\" aria-label=\"Link to this section\" title=\"Link to this section\">#<\/a><\/h1>\n<p><a href=\"https:\/\/travis-ci.org\/\">Travis CI<\/a> is a popular continuous integration tool. It can be used to run tests when the project code changes, automatically publish changes to the repository, etc., etc. With this config, we configure Travis to install Chrome for each execution. This can be used for e.g. automated UI testing.<\/p>\n<h1 id=\"container-based-infrastructure\">Container-based infrastructure<a href=\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/#container-based-infrastructure\" class=\"heading-link\" aria-label=\"Link to this section\" title=\"Link to this section\">#<\/a><\/h1>\n<p><a href=\"https:\/\/blog.travis-ci.com\/2016-11-08-trusty-container-public-beta\/\">Since the beginning of November 2016<\/a>, you can run Ubuntu 14.04 on Travis CI in a container-based environment. A container-based environment is cool because it noticeably speeds up builds, has more resources <a href=\"https:\/\/docs.travis-ci.com\/user\/migrating-from-legacy\/\">and more<\/a>. The drawback is that you can\u2019t use <em>sudo<\/em>, but Travis has replacements for some common use-cases.<\/p>\n<p>What does this do with Chrome? Chrome can\u2019t be installed on Ubuntu 12.04 which just recently was the only available container-based environment. If you were doing UI testing, you either had to use Firefox (geckodriver) which was buggy as hell or had to accept much longer build times. \u00af&#92;&#95;(\u30c4)&#95;\/\u00af<\/p>\n<p>This config <em>does<\/em> enable the container-based infrastructure.<\/p>\n<h1 id=\"what-does-the-code-mean\">What does the code mean<a href=\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/#what-does-the-code-mean\" class=\"heading-link\" aria-label=\"Link to this section\" title=\"Link to this section\">#<\/a><\/h1>\n<pre><code class=\"text\">sudo: false\ndist: trusty\n<\/code><\/pre>\n<p><em>sudo: false<\/em> switches the environment into the container-based mode (and disables <em>sudo<\/em>). <em>dist: trusty<\/em> switches the distribution to Ubuntu 14.04 (the default one is 12.04). Here\u2019re the other field values if you need them: <a href=\"https:\/\/docs.travis-ci.com\/user\/ci-environment\/\">https:\/\/docs.travis-ci.com\/user\/ci-environment\/<\/a><\/p>\n<p><\/p>\n<pre><code class=\"text\">addons:\n  apt:\n    packages:\n      - google-chrome-stable\n<\/code><\/pre>\n<p>This installs Chrome. Travis provides <a href=\"https:\/\/docs.travis-ci.com\/user\/installing-dependencies\/#Installing-Packages-with-the-APT-Addon\">the <em>apt<\/em> addon<\/a> which is a handy way to install necessary packages. (Also, it\u2019s the only way possible in the container-based infrastructure.)<\/p>\n<p>The <em>packages<\/em> part of the addon specifies to install the <em>google-chrome-stable<\/em> package. This package gets installed from the official\u00a0Google Chrome source which seems to be enabled in Travis by default.<\/p>\n<p>Here\u2019re the docs for the <em>apt<\/em> addon: <a href=\"https:\/\/docs.travis-ci.com\/user\/installing-dependencies\/#Installing-Packages-with-the-APT-Addon\">https:\/\/docs.travis-ci.com\/user\/installing-dependencies\/#Installing-Packages-with-the-APT-Addon<\/a><\/p>\n<p><\/p>\n<pre><code class=\"text\">before_script:\n  - export DISPLAY=:99.0\n  - sh -e \/etc\/init.d\/xvfb start &amp;\n  - sleep 3\n<\/code><\/pre>\n<p>This starts <em>xvfb<\/em> (X Virtual Framebuffer) that imitates the display and makes Chrome think it\u2019s run in a GUI environment. <em>sleep: 3<\/em> is required to give <em>xvfb<\/em> time to start (this is what Travis recommends to do). If you need to set the screen resolution or the pixel depth, check out the docs: <a href=\"https:\/\/docs.travis-ci.com\/user\/gui-and-headless-browsers\/#Using-xvfb-to-Run-Tests-That-Require-a-GUI\">https:\/\/docs.travis-ci.com\/user\/gui-and-headless-browsers\/#Using-xvfb-to-Run-Tests-That-Require-a-GUI<\/a><\/p>\n<p><em>Did this help you? Follow me on Twitter: <a href=\"https:\/\/twitter.com\/iamakulov\">@iamakulov<\/a><\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Updated 22 Jan 2017: removed the \u201caddons.apt.sources\u201d because looks like the google-chrome source is now provided by default. Here\u2019s the code. Scroll down for more details: What\u2019s this# Travis CI is a popular continuous integration tool. It can be used to run tests when the project code changes, automatically publish changes to the repository, etc., &hellip; <a href=\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;How to install Google Chrome on Travis (in a container-based environment)&#8221;<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[10,5],"class_list":["post-53","post","type-post","status-publish","format-standard","hentry","category-uncategorized","tag-ci","tag-testing"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v23.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>How to install Google Chrome on Travis (in a container-based environment) - Ivan Akulov\u2019s blog<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to install Google Chrome on Travis (in a container-based environment) - Ivan Akulov\u2019s blog\" \/>\n<meta property=\"og:description\" content=\"Updated 22 Jan 2017: removed the \u201caddons.apt.sources\u201d because looks like the google-chrome source is now provided by default. Here\u2019s the code. Scroll down for more details: What\u2019s this# Travis CI is a popular continuous integration tool. It can be used to run tests when the project code changes, automatically publish changes to the repository, etc., &hellip; Continue reading &quot;How to install Google Chrome on Travis (in a container-based environment)&quot;\" \/>\n<meta property=\"og:url\" content=\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/\" \/>\n<meta property=\"og:site_name\" content=\"Ivan Akulov\u2019s blog\" \/>\n<meta property=\"article:publisher\" content=\"http:\/\/facebook.com\/iamakulov.page\" \/>\n<meta property=\"article:published_time\" content=\"2016-11-20T22:15:42+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2017-05-05T23:27:02+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/iamakulov.com\/notes2\/wp-content\/uploads\/2017\/05\/TravisChrome1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1600\" \/>\n\t<meta property=\"og:image:height\" content=\"1100\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Ivan Akulov\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@iamakulov\" \/>\n<meta name=\"twitter:site\" content=\"@iamakulov\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ivan Akulov\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/\",\"url\":\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/\",\"name\":\"How to install Google Chrome on Travis (in a container-based environment) - Ivan Akulov\u2019s blog\",\"isPartOf\":{\"@id\":\"https:\/\/iamakulov.com\/notes\/#website\"},\"datePublished\":\"2016-11-20T22:15:42+00:00\",\"dateModified\":\"2017-05-05T23:27:02+00:00\",\"author\":{\"@id\":\"https:\/\/iamakulov.com\/notes\/#\/schema\/person\/ebf7b61bf573e7be5fe438f50ebd9b81\"},\"breadcrumb\":{\"@id\":\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/iamakulov.com\/notes\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"How to install Google Chrome on Travis (in a container-based environment)\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/iamakulov.com\/notes\/#website\",\"url\":\"https:\/\/iamakulov.com\/notes\/\",\"name\":\"Ivan Akulov\u2019s blog\",\"description\":\"Ivan Akulov writes about his front-end experience, React, webpack, and performance optimizations.\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/iamakulov.com\/notes\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/iamakulov.com\/notes\/#\/schema\/person\/ebf7b61bf573e7be5fe438f50ebd9b81\",\"name\":\"Ivan Akulov\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/iamakulov.com\/notes\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/aec4e9e944911b58f2c3d14b7f9e5412a217e5738359c3f52e824b4de2b2263c?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/aec4e9e944911b58f2c3d14b7f9e5412a217e5738359c3f52e824b4de2b2263c?s=96&d=mm&r=g\",\"caption\":\"Ivan Akulov\"},\"description\":\"I'm a software engineer specializing in web performance, JavaScript, and React. I\u2019m also a Google Developer Expert. I work at Framer.\",\"sameAs\":[\"http:\/\/iamakulov.com\",\"https:\/\/x.com\/iamakulov\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to install Google Chrome on Travis (in a container-based environment) - Ivan Akulov\u2019s blog","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/","og_locale":"en_US","og_type":"article","og_title":"How to install Google Chrome on Travis (in a container-based environment) - Ivan Akulov\u2019s blog","og_description":"Updated 22 Jan 2017: removed the \u201caddons.apt.sources\u201d because looks like the google-chrome source is now provided by default. Here\u2019s the code. Scroll down for more details: What\u2019s this# Travis CI is a popular continuous integration tool. It can be used to run tests when the project code changes, automatically publish changes to the repository, etc., &hellip; Continue reading \"How to install Google Chrome on Travis (in a container-based environment)\"","og_url":"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/","og_site_name":"Ivan Akulov\u2019s blog","article_publisher":"http:\/\/facebook.com\/iamakulov.page","article_published_time":"2016-11-20T22:15:42+00:00","article_modified_time":"2017-05-05T23:27:02+00:00","og_image":[{"width":1600,"height":1100,"url":"https:\/\/iamakulov.com\/notes2\/wp-content\/uploads\/2017\/05\/TravisChrome1.png","type":"image\/png"}],"author":"Ivan Akulov","twitter_card":"summary_large_image","twitter_creator":"@iamakulov","twitter_site":"@iamakulov","twitter_misc":{"Written by":"Ivan Akulov","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/","url":"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/","name":"How to install Google Chrome on Travis (in a container-based environment) - Ivan Akulov\u2019s blog","isPartOf":{"@id":"https:\/\/iamakulov.com\/notes\/#website"},"datePublished":"2016-11-20T22:15:42+00:00","dateModified":"2017-05-05T23:27:02+00:00","author":{"@id":"https:\/\/iamakulov.com\/notes\/#\/schema\/person\/ebf7b61bf573e7be5fe438f50ebd9b81"},"breadcrumb":{"@id":"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/iamakulov.com\/notes\/install-google-chrome-on-travis\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/iamakulov.com\/notes\/"},{"@type":"ListItem","position":2,"name":"How to install Google Chrome on Travis (in a container-based environment)"}]},{"@type":"WebSite","@id":"https:\/\/iamakulov.com\/notes\/#website","url":"https:\/\/iamakulov.com\/notes\/","name":"Ivan Akulov\u2019s blog","description":"Ivan Akulov writes about his front-end experience, React, webpack, and performance optimizations.","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/iamakulov.com\/notes\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/iamakulov.com\/notes\/#\/schema\/person\/ebf7b61bf573e7be5fe438f50ebd9b81","name":"Ivan Akulov","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/iamakulov.com\/notes\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/aec4e9e944911b58f2c3d14b7f9e5412a217e5738359c3f52e824b4de2b2263c?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/aec4e9e944911b58f2c3d14b7f9e5412a217e5738359c3f52e824b4de2b2263c?s=96&d=mm&r=g","caption":"Ivan Akulov"},"description":"I'm a software engineer specializing in web performance, JavaScript, and React. I\u2019m also a Google Developer Expert. I work at Framer.","sameAs":["http:\/\/iamakulov.com","https:\/\/x.com\/iamakulov"]}]}},"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/posts\/53","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/comments?post=53"}],"version-history":[{"count":9,"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/posts\/53\/revisions"}],"predecessor-version":[{"id":64,"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/posts\/53\/revisions\/64"}],"wp:attachment":[{"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/media?parent=53"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/categories?post=53"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/iamakulov.com\/notes\/wp-json\/wp\/v2\/tags?post=53"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}