Add UK influencer campaign page (Fixes mozilla#15841)

Author: alexgibson

bedrock/base/templates/base-protocol.html

@@ -150,7 +150,7 @@
       <!--<![endif]-->
 
       <!--[if IE 9]>
-        {# IE9 has its own lib JS bundle containing dependencies for anaytics and consent management. #}
+        {# IE9 has its own lib JS bundle containing dependencies for analytics and consent management. #}
         {{ js_bundle('lib-ie') }}
       <![endif]-->
     {% endblock %}

bedrock/firefox/templates/firefox/landing/productivity.html

@@ -0,0 +1,34 @@
+{#
+ This Source Code Form is subject to the terms of the Mozilla Public
+ License, v. 2.0. If a copy of the MPL was not distributed with this
+ file, You can obtain one at https://mozilla.org/MPL/2.0/.
+#}
+
+{% extends "firefox/new/desktop/download.html" %}
+
+{% block canonical_urls %}<meta name="robots" content="noindex,follow">{% endblock %}
+
+{% set win_smi_download_id = 'partner-firefox-release-smi-smi-001-stub' %}
+{% set mac_smi_download_id = 'partner-firefox-release-smi-smi-001' %}
+
+{% block string_data %}
+  data-win-smi-id="{{ win_smi_download_id }}"
+  data-mac-smi-id="{{ mac_smi_download_id }}"
+{% endblock %}
+
+{% block primary_cta %}
+  {{ download_firefox(dom_id='download-primary', force_direct=True, download_location='primary cta') }}
+{% endblock %}
+
+{% block features_cta %}
+  {{ download_firefox(dom_id='download-features', force_direct=True, download_location='features cta') }}
+{% endblock %}
+
+{% block discover_cta %}
+  {{ download_firefox(dom_id='download-discover', force_direct=True, download_location='discover cta') }}
+{% endblock %}
+
+{% block js %}
+  {{ super() }}
+  {{ js_bundle('firefox_smi_download') }}
+{% endblock %}

bedrock/firefox/templates/firefox/new/desktop/download.html

@@ -89,7 +89,9 @@ <h1 class="mzp-c-wordmark mzp-t-wordmark-md mzp-t-product-firefox">{{ ftl('firef
           <h2 class="mzp-has-zap-7">{{ ftl('firefox-desktop-download-get-the-browser') }}</h2>
           <p>{{ ftl('firefox-desktop-download-no-shady') }}</p>
         <div class="c-intro-download">
-          {{ download_firefox_thanks(locale_in_transition=True, download_location='primary cta') }}
+          {% block primary_cta %}
+            {{ download_firefox_thanks(locale_in_transition=True, download_location='primary cta') }}
+          {% endblock %}
 
           <div class="c-intro-download-alt"><a href="{{ url('firefox.all') }}">{{ ftl('firefox-desktop-download-download-options') }}</a></div>
 
@@ -384,8 +386,9 @@ <h3 class="mzp-u-title-xs">{{ ftl('firefox-desktop-download-customize-your-brows
           </ul>
         </div>
       </div>
-      {{ download_firefox_thanks(dom_id='download-features', locale_in_transition=True, download_location='features cta') }}
-
+      {% block features_cta %}
+        {{ download_firefox_thanks(dom_id='download-features', locale_in_transition=True, download_location='features cta') }}
+      {% endblock %}
     </div>
   </section>
 
@@ -545,7 +548,9 @@ <h3 class="mzp-u-title-xs">{{ ftl('firefox-desktop-download-picture-in-picture')
         <p>{{ ftl('firefox-desktop-download-from-watching-a') }}</p>
       </div>
     </div>
-    {{ download_firefox_thanks(dom_id='download-discover', locale_in_transition=True, download_location='discover cta') }}
+    {% block discover_cta %}
+      {{ download_firefox_thanks(dom_id='download-discover', locale_in_transition=True, download_location='discover cta') }}
+    {% endblock %}
   </section>
 
   <section class="c-support">

bedrock/firefox/urls.py

@@ -270,6 +270,8 @@
         "firefox/firefox-20th/index.html",
         active_locales=["de", "fr", "en-US", "en-CA", "en-GB"],
     ),
+    # Issue 15841 - UK influencer campaign
+    page("firefox/landing/productivity/", "firefox/landing/productivity.html", ftl_files="firefox/new/desktop", active_locales="en-GB"),
 )
 
 # Contentful

media/js/firefox/landing/smi-download-init.es6.js

@@ -0,0 +1,9 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+
+import SMIDownload from './smi-download.es6';
+
+SMIDownload.init();

media/js/firefox/landing/smi-download.es6.js

@@ -0,0 +1,48 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+
+const SMIDownload = {};
+
+let winDownloadID;
+let macDownloadID;
+
+SMIDownload.createCustomDownloadURL = (link, id) => {
+    const url = new URL(link.href);
+    url.searchParams.set('product', id);
+    link.href = url;
+};
+
+SMIDownload.replaceWithCustomDownloadLinks = () => {
+    const downloadLinksWin = Array.from(
+        document.querySelectorAll(
+            '.download-button .download-list .download-link[data-download-version="win"]'
+        )
+    );
+    const downloadLinksMac = Array.from(
+        document.querySelectorAll(
+            '.download-button .download-list .download-link[data-download-version="osx"]'
+        )
+    );
+
+    downloadLinksWin.every((link) =>
+        SMIDownload.createCustomDownloadURL(link, winDownloadID)
+    );
+    downloadLinksMac.every((link) =>
+        SMIDownload.createCustomDownloadURL(link, macDownloadID)
+    );
+};
+
+SMIDownload.init = () => {
+    const strings = document.getElementById('strings');
+    winDownloadID = strings.getAttribute('data-win-smi-id');
+    macDownloadID = strings.getAttribute('data-mac-smi-id');
+
+    if (typeof window.URL === 'function' && winDownloadID && macDownloadID) {
+        SMIDownload.replaceWithCustomDownloadLinks();
+    }
+};
+
+export default SMIDownload;

media/static-bundles.json

@@ -1782,6 +1782,12 @@
         "js/base/banners/fundraiser-experiment.es6.js"
       ],
       "name": "fundraising-banner-experiment"
+    },
+    {
+      "files": [
+        "js/firefox/landing/smi-download-init.es6.js"
+      ],
+      "name": "firefox_smi_download"
     }
   ]
 }

tests/unit/spec/firefox/landing/smi-download.js

@@ -0,0 +1,206 @@
+/*
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at https://mozilla.org/MPL/2.0/.
+ */
+
+/* For reference read the Jasmine and Sinon docs
+ * Jasmine docs: https://jasmine.github.io/
+ * Sinon docs: http://sinonjs.org/docs/
+ */
+
+import SMIDownload from '../../../../../media/js/firefox/landing/smi-download.es6';
+
+describe('smi-download.es6.js', function () {
+    describe('init()', function () {
+        beforeEach(function () {
+            const strings = `<div id="strings" data-win-smi-id="partner-firefox-release-smi-smi-001-stub" data-mac-smi-id="partner-firefox-release-smi-smi-001"></div>`;
+
+            const button = `<div id="download-primary" class="download-button mzp-c-button-download-container">
+                <ul class="download-list">
+                    <li class="os_win64">
+                        <a class="download-link button" id="download-primary-win64" href="https://download.mozilla.org/?product=firefox-stub&amp;os=win64&amp;lang=en-GB" data-download-version="win64">
+                            Download Firefox
+                        </a>
+                    </li>
+                    <li class="os_win64-msi">
+                        <a class="download-link button" id="download-primary-win64-msi" href="https://download.mozilla.org/?product=firefox-msi-latest-ssl&amp;os=win64&amp;lang=en-GB" data-download-version="win64-msi">
+                            >Download Firefox
+                        </a>
+                    </li>
+                    <li class="os_win64-aarch64">
+                        <a class="download-link button" id="download-primary-win64-aarch64" href="https://download.mozilla.org/?product=firefox-latest-ssl&amp;os=win64-aarch64&amp;lang=en-GB" data-download-version="win64-aarch64">
+                            Download Firefox
+                        </a>
+                    </li>
+                    <li class="os_win">
+                        <a class="download-link button" id="download-primary-win" href="https://download.mozilla.org/?product=firefox-stub&amp;os=win&amp;lang=en-GB" data-download-version="win">
+                            Download Firefox
+                        </a>
+                    </li>
+                    <li class="os_win-msi">
+                        <a class="download-link button" id="download-primary-win-msi" href="https://download.mozilla.org/?product=firefox-msi-latest-ssl&amp;os=win&amp;lang=en-GB" data-download-version="win-msi">
+                            Download Firefox
+                        </a>
+                    </li>
+                    <li class="os_osx">
+                        <a class="download-link button" id="download-primary-osx" href="https://download.mozilla.org/?product=firefox-latest-ssl&amp;os=osx&amp;lang=en-GB" data-download-version="osx">
+                            Download Firefox
+                        </a>
+                    </li>
+                    <li class="os_linux64">
+                        <a class="download-link button" id="download-primary-linux64" href="https://download.mozilla.org/?product=firefox-latest-ssl&amp;os=linux64&amp;lang=en-GB" data-download-version="linux64">
+                            Download for Linux 64-bit
+                        </a>
+                    </li>
+                    <li class="os_linux">
+                        <a class="download-link button" id="download-primary-linux" href="https://download.mozilla.org/?product=firefox-latest-ssl&amp;os=linux&amp;lang=en-GB" data-download-version="linux">
+                            Download for Linux 32-bit
+                        </a>
+                    </li>
+                    <li class="os_android">
+                        <a class="download-link button" id="download-primary-android" href="https://play.google.com/store/apps/details?id=org.mozilla.firefox&amp;referrer=utm_source%3Dmozilla%26utm_medium%3DReferral%26utm_campaign%3Dmozilla-org" data-download-version="android">
+                            Firefox for Android
+                        </a>
+                    </li>
+                    <li class="os_ios">
+                        <a class="download-link button" id="download-primary-ios" href="https://apps.apple.com/us/app/apple-store/id989804926" data-download-version="ios">
+                            Firefox for iOS
+                        </a>
+                    </li>
+                </ul>
+            </div>`;
+
+            document.body.insertAdjacentHTML('beforeend', strings);
+            document.body.insertAdjacentHTML('beforeend', button);
+        });
+
+        afterEach(function () {
+            const strings = document.getElementById('strings');
+            strings.parentNode.removeChild(strings);
+
+            const button = document.getElementById('download-primary');
+            button.parentNode.removeChild(button);
+        });
+
+        it('should should update Windows and macOS download URLs with a custom build link', function () {
+            SMIDownload.init();
+
+            const downloadLinksWin = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="win"]'
+                )
+            );
+            const downloadLinksMac = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="osx"]'
+                )
+            );
+
+            downloadLinksWin.every((link) =>
+                expect(link.href).toContain(
+                    '?product=partner-firefox-release-smi-smi-001-stub'
+                )
+            );
+            downloadLinksMac.every((link) =>
+                expect(link.href).toContain(
+                    '?product=partner-firefox-release-smi-smi-001'
+                )
+            );
+        });
+
+        it('should should not update Windows URLs that are not visible on landing page', function () {
+            SMIDownload.init();
+
+            const downloadLinksWin64 = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="win64"]'
+                )
+            );
+            const downloadLinksWinMsi = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="win64-msi"]'
+                )
+            );
+            const downloadLinksWinAarch64 = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="win64-aarch64"]'
+                )
+            );
+
+            downloadLinksWin64.every((link) =>
+                expect(link.href).not.toContain(
+                    '?product=partner-firefox-release-smi-smi-001-stub'
+                )
+            );
+            downloadLinksWinMsi.every((link) =>
+                expect(link.href).not.toContain(
+                    '?product=partner-firefox-release-smi-smi-001'
+                )
+            );
+            downloadLinksWinAarch64.every((link) =>
+                expect(link.href).not.toContain(
+                    '?product=partner-firefox-release-smi-smi-001'
+                )
+            );
+        });
+
+        it('should should not update Linux download URLs with a custom build link', function () {
+            SMIDownload.init();
+
+            const downloadLinksLinux = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="linux"]'
+                )
+            );
+            const downloadLinksLinux64 = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="linux64"]'
+                )
+            );
+
+            downloadLinksLinux.every((link) =>
+                expect(link.href).not.toContain(
+                    '?product=partner-firefox-release-smi-smi-001'
+                )
+            );
+            downloadLinksLinux64.every((link) =>
+                expect(link.href).not.toContain(
+                    '?product=partner-firefox-release-smi-smi-001'
+                )
+            );
+        });
+
+        it('should should not update iOS download URLs with a custom build link', function () {
+            SMIDownload.init();
+
+            const downloadLinksIOS = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="ios"]'
+                )
+            );
+
+            downloadLinksIOS.every((link) =>
+                expect(link.href).not.toContain(
+                    '?product=partner-firefox-release-smi-smi-001'
+                )
+            );
+        });
+
+        it('should should not update Android download URLs with a custom build link', function () {
+            SMIDownload.init();
+
+            const downloadLinksAndroid = Array.from(
+                document.querySelectorAll(
+                    '.download-button .download-list .download-link[data-download-version="android"]'
+                )
+            );
+
+            downloadLinksAndroid.every((link) =>
+                expect(link.href).not.toContain(
+                    '?product=partner-firefox-release-smi-smi-001'
+                )
+            );
+        });
+    });
+});