[deploy] Remove Onboarding's ClosingSlide (#7443)

app/assets/javascripts/initializers/initializeOnboardingTaskCard.js.erb

@@ -8,8 +8,7 @@ function initializeOnboardingTaskCard() {
   if (localStorage.getItem('task-card-closed') === 'yes') { return }
 
   var taskCard = document.getElementsByClassName("onboarding-task-card")[0];
-
-  if (taskCard == null) { return }
+  if (taskCard == null) { return } // This guard against both null and undefined taskCard
 
   var createdAt = new Date(userData().created_at);
   var now = new Date();

app/javascript/onboarding/Onboarding.jsx

@@ -3,7 +3,6 @@ import { h, Component } from 'preact';
 
 import IntroSlide from './components/IntroSlide';
 import EmailPreferencesForm from './components/EmailPreferencesForm';
-import ClosingSlide from './components/ClosingSlide';
 import FollowTags from './components/FollowTags';
 import FollowUsers from './components/FollowUsers';
 import ProfileForm from './components/ProfileForm';
@@ -24,7 +23,6 @@ export default class Onboarding extends Component {
       ProfileForm,
       FollowUsers,
       EmailPreferencesForm,
-      ClosingSlide,
     ];
 
     this.slides = slides.map((SlideComponent) => (
@@ -47,6 +45,8 @@ export default class Onboarding extends Component {
       this.setState({
         currentSlide: nextSlide,
       });
+    } else {
+      window.location.href = '/';
     }
   }
 

app/javascript/onboarding/__tests__/Onboarding.test.jsx

@@ -302,6 +302,7 @@ describe('<Onboarding />', () => {
 
   describe('EmailPreferencesForm', () => {
     let onboardingSlides;
+    const { location } = window;
     const emailPreferencesFormIndex = 4;
 
     beforeEach(() => {
@@ -311,18 +312,32 @@ describe('<Onboarding />', () => {
       );
     });
 
+    afterEach(() => {
+      window.location = location;
+    });
+
     test('renders properly', () => {
       expect(onboardingSlides).toMatchSnapshot();
     });
 
-    test('should allow user to advance', async () => {
+    test('should redirect user when finished', async () => {
       fetch.once({});
 
+      // Setup: Enable window.location to be writable.
+      const url = 'https://dummy.com/onboarding';
+      Object.defineProperty(window, 'location', {
+        value: { href: url },
+        writable: true,
+      });
+
+      expect(window.location.href).toBe(url);
       onboardingSlides.find('.next-button').simulate('click');
       await flushPromises();
+      // No longer advance slide.
       expect(onboardingSlides.state().currentSlide).toBe(
-        emailPreferencesFormIndex + 1,
+        emailPreferencesFormIndex,
       );
+      expect(window.location.href).toBe('/');
     });
 
     it('should step backward', () => {
@@ -332,17 +347,4 @@ describe('<Onboarding />', () => {
       );
     });
   });
-
-  describe('ClosingSlide', () => {
-    let onboardingSlides;
-    const closingSlideIndex = 5;
-
-    beforeEach(() => {
-      onboardingSlides = initializeSlides(closingSlideIndex, getUserData());
-    });
-
-    test('renders properly', () => {
-      expect(onboardingSlides).toMatchSnapshot();
-    });
-  });
 });

app/javascript/onboarding/__tests__/__snapshots__/Onboarding.test.jsx.snap

@@ -1,82 +1,5 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<Onboarding /> ClosingSlide renders properly 1`] = `
-preact-render-spy (1 nodes)
--------
-<main class="onboarding-body">
-  <div class="onboarding-main">
-    <div class="onboarding-content">
-      <header class="onboarding-content-header">
-        <h1 class="title">
-          You‘re a part of the community!
-          <span
-            role="img"
-            aria-label="tada"
-          >
-             🎉
-          </span>
-        </h1>
-        <h2 class="subtitle">What next?</h2>
-      </header>
-      <div class="onboarding-what-next">
-        <a
-          href="/welcome"
-          data-no-instant={true}
-        >
-          <p>
-            <span
-              class="whatnext-emoji"
-              role="img"
-              aria-label="tada"
-            >
-              😊
-            </span>
-            Join the Welcome Thread
-          </p>
-        </a>
-        <a href="/new">
-          <p>
-            <span
-              class="whatnext-emoji"
-              role="img"
-              aria-label="tada"
-            >
-              ✍️
-            </span>
-            Write your first DEV post
-          </p>
-        </a>
-        <a href="/top/infinity">
-          <p>
-            <span
-              class="whatnext-emoji"
-              role="img"
-              aria-label="tada"
-            >
-              🤓
-            </span>
-            Read all-time top posts
-          </p>
-        </a>
-        <a href="/settings">
-          <p>
-            <span
-              class="whatnext-emoji"
-              role="img"
-              aria-label="tada"
-            >
-              💅
-            </span>
-            Customize your profile
-          </p>
-        </a>
-      </div>
-    </div>
-  </div>
-</main>
-
-`;
-
 exports[`<Onboarding /> EmailPreferencesForm renders properly 1`] = `
 preact-render-spy (1 nodes)
 -------

app/javascript/onboarding/components/ClosingSlide.jsx

@@ -1,90 +0,0 @@
-import { h, Component } from 'preact';
-import PropTypes from 'prop-types';
-
-import { updateOnboarding } from '../utilities';
-
-class ClosingSlide extends Component {
-  componentDidMount() {
-    updateOnboarding('closing slide');
-  }
-
-  render() {
-    const { previousLocation } = this.props;
-
-    const previousLocationListElement = () => {
-      if (
-        previousLocation !== 'none' &&
-        previousLocation !== null &&
-        !previousLocation.startsWith('javascript')
-      ) {
-        return (
-          <a className="onboarding-previous-location" href={previousLocation}>
-            <div>Or go back to the page you were on before you signed up</div>
-            <code>{previousLocation}</code>
-          </a>
-        );
-      }
-      return null;
-    };
-
-    return (
-      <div className="onboarding-main">
-        <div className="onboarding-content">
-          <header className="onboarding-content-header">
-            <h1 className="title">
-              You&lsquo;re a part of the community!
-              <span role="img" aria-label="tada">
-                {' '}
-                🎉
-              </span>
-            </h1>
-            <h2 className="subtitle">What next?</h2>
-          </header>
-
-          <div className="onboarding-what-next">
-            <a href="/welcome" data-no-instant>
-              <p>
-                <span className="whatnext-emoji" role="img" aria-label="tada">
-                  😊
-                </span>
-                Join the Welcome Thread
-              </p>
-            </a>
-            <a href="/new">
-              <p>
-                <span className="whatnext-emoji" role="img" aria-label="tada">
-                  ✍️
-                </span>
-                Write your first DEV post
-              </p>
-            </a>
-            <a href="/top/infinity">
-              <p>
-                <span className="whatnext-emoji" role="img" aria-label="tada">
-                  🤓
-                </span>
-                Read all-time top posts
-              </p>
-            </a>
-            <a href="/settings">
-              <p>
-                <span className="whatnext-emoji" role="img" aria-label="tada">
-                  💅
-                </span>
-                Customize your profile
-              </p>
-            </a>
-          </div>
-
-          {previousLocationListElement()}
-        </div>
-      </div>
-    );
-  }
-}
-
-ClosingSlide.propTypes = {
-  previousLocation: PropTypes.string.isRequired,
-};
-
-export default ClosingSlide;