Use 'en' codelabs on translated pages (GoogleChrome#7470)

* Use 'en' codelabs on translated pages

* Switch to defaultLanguage const

* Improve tests

Author: jeffposnick

src/site/_includes/components/CodelabsCallout.js

@@ -15,9 +15,24 @@
  */
 
 const {html} = require('common-tags');
+
+const {defaultLanguage} = require('../../../lib/utils/language');
 const {findByUrl} = require('../../_filters/find-by-url');
 const md = require('../../_filters/md');
 
+/**
+ * Find matching collection items given a language code.
+ *
+ * @param {string[]} slugs
+ * @param {string} lang
+ * @returns {EleventyCollectionItem[]}
+ */
+function filterCodelabsByLang(slugs, lang) {
+  return slugs
+    .map((slug) => findByUrl(`/${lang}/${slug}/`))
+    .filter((item) => item); // filter out any undefined entries
+}
+
 /**
  * Generates codelab links HTML.
  *
@@ -29,12 +44,15 @@ function CodelabsCallout(slugs, lang) {
   // Coerce slugs to Array just in case someone pasted in a single slug string.
   slugs = slugs instanceof Array ? slugs : [slugs];
 
-  const codelabs = slugs
-    .map((slug) => findByUrl(`/${lang}/${slug}/`))
-    .filter((item) => item); // filter out any undefined entries
-
-  if (!codelabs.length) {
-    return;
+  let codelabs = filterCodelabsByLang(slugs, lang);
+  // If there's no language-specific codelab, returning the default (English)
+  // language one is preferable.
+  if (codelabs.length === 0) {
+    codelabs = filterCodelabsByLang(slugs, defaultLanguage);
+  }
+  // If there's still no codelabs found, return an empty string (not undefined).
+  if (codelabs.length === 0) {
+    return '';
   }
 
   return `

test/unit/src/site/_includes/components/CodelabsCallout.js

@@ -17,6 +17,8 @@
 
 const {expect} = require('chai');
 const cheerio = require('cheerio');
+
+const {defaultLanguage} = require('../../../../../../src/lib/utils/language');
 const {memoize} = require('../../../../../../src/site/_filters/find-by-url');
 const CodelabsCallout = require('../../../../../../src/site/_includes/components/CodelabsCallout');
 
@@ -42,12 +44,19 @@ describe('CodelabsCallout', function () {
       expect(li.length).to.equal(3);
     });
 
-    it('returns nothing if URLs not found', async function () {
+    it('returns an empty string if URLs not found', async function () {
       const html = CodelabsCallout(
         collectionAll.map((i) => i.url + '/pop'),
         'en',
       );
-      expect(html).to.equal(undefined);
+      expect(html).to.equal('');
+    });
+
+    it('returns the default-language codelab as a fallback', async function () {
+      const html = CodelabsCallout('foobar', 'zz');
+      const $ = cheerio.load(html);
+      expect($('a').attr('href')).to.equal(`/${defaultLanguage}/foobar/`);
+      expect($('span').text()).to.equal('foobar');
     });
   });