tests(install-wizard): Add test for Install Wizard (#9678)

Adds test/fixture for Install Wizard

src/sentry/static/sentry/app/views/installWizard.jsx

@@ -23,12 +23,13 @@ export default class InstallWizard extends AsyncView {
     jQuery(document.body).removeClass('install-wizard');
   }
 
-  getEndpoint() {
-    return '/internal/options/?query=is:required';
+  getEndpoints() {
+    return [['data', '/internal/options/?query=is:required']];
   }
 
   renderFormFields() {
     let options = this.state.data;
+
     let missingOptions = new Set(
       Object.keys(options).filter(option => !options[option].field.isSet)
     );
@@ -108,7 +109,7 @@ export default class InstallWizard extends AsyncView {
     return (
       <ApiForm
         apiMethod="PUT"
-        apiEndpoint={this.getEndpoint()}
+        apiEndpoint={this.getEndpoints()[0][1]}
         submitLabel={t('Continue')}
         initialData={this.getInitialData()}
         onSubmitSuccess={this.props.onConfigured}

tests/js/fixtures/installWizard.js

@@ -0,0 +1,105 @@
+export function InstallWizard(params) {
+  return {
+    'mail.use-tls': {
+      field: {
+        disabledReason: null,
+        default: false,
+        required: true,
+        disabled: false,
+        allowEmpty: true,
+        isSet: true,
+      },
+    },
+    'mail.username': {
+      field: {
+        disabledReason: null,
+        default: '',
+        required: true,
+        disabled: false,
+        allowEmpty: true,
+        isSet: true,
+      },
+    },
+    'mail.port': {
+      field: {
+        disabledReason: null,
+        default: 25,
+        required: true,
+        disabled: false,
+        allowEmpty: false,
+        isSet: true,
+      },
+    },
+    'system.admin-email': {
+      field: {
+        disabledReason: null,
+        default: '',
+        required: true,
+        disabled: false,
+        allowEmpty: false,
+        isSet: true,
+      },
+    },
+    'mail.password': {
+      field: {
+        disabledReason: null,
+        default: '',
+        required: true,
+        disabled: false,
+        allowEmpty: true,
+        isSet: true,
+      },
+    },
+    'mail.from': {
+      field: {
+        disabledReason: null,
+        default: 'root@localhost',
+        required: true,
+        disabled: false,
+        allowEmpty: false,
+        isSet: true,
+      },
+    },
+    'system.url-prefix': {
+      field: {
+        disabledReason: 'diskPriority',
+        default: '',
+        required: true,
+        disabled: true,
+        allowEmpty: false,
+        isSet: true,
+      },
+    },
+    'auth.allow-registration': {
+      field: {
+        disabledReason: null,
+        default: false,
+        required: true,
+        disabled: false,
+        allowEmpty: true,
+        isSet: true,
+      },
+    },
+    'beacon.anonymous': {
+      field: {
+        disabledReason: null,
+        default: false,
+        required: true,
+        disabled: false,
+        allowEmpty: true,
+        isSet: true,
+      },
+    },
+    'mail.host': {
+      field: {
+        disabledReason: null,
+        default: 'localhost',
+        required: true,
+        disabled: false,
+        allowEmpty: false,
+        isSet: true,
+      },
+    },
+    ...params,
+  };
+}

tests/js/spec/views/__snapshots__/installWizard.spec.jsx.snap

@@ -0,0 +1,556 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`InstallWizard renders 1`] = `
+<InstallWizard
+  onConfigured={[MockFunction]}
+>
+  <SideEffect(DocumentTitle)
+    title="Setup Sentry"
+  >
+    <DocumentTitle
+      title="Setup Sentry"
+    >
+      <div
+        className="app"
+      >
+        <div
+          className="pattern"
+        />
+        <div
+          className="setup-wizard"
+        >
+          <h1>
+            <span>
+              Welcome to Sentry
+            </span>
+            <small>
+              1.33.7
+            </small>
+          </h1>
+          <ApiForm
+            apiEndpoint="/internal/options/?query=is:required"
+            apiMethod="PUT"
+            cancelLabel="Cancel"
+            className="form-stacked"
+            errorMessage="Unable to save your changes. Please ensure all fields are valid and try again."
+            footerClass="form-actions align-right"
+            hideErrors={false}
+            initialData={Object {}}
+            onSubmitSuccess={[MockFunction]}
+            requireChanges={false}
+            resetOnError={false}
+            submitDisabled={false}
+            submitErrorMessage="There was an error saving your changes."
+            submitLabel="Continue"
+            submitLoadingMessage="Saving changes.."
+          >
+            <StyledForm
+              className="form-stacked"
+              onSubmit={[Function]}
+            >
+              <form
+                className="form-stacked css-10f3krf-StyledForm ejqwck10"
+                onSubmit={[Function]}
+              >
+                <p>
+                  Complete setup by filling out the required configuration.
+                </p>
+                <fieldset
+                  key="system"
+                >
+                  <EmailField
+                    allowEmpty={false}
+                    component={[Function]}
+                    default=""
+                    disabled={false}
+                    disabledReason={null}
+                    help="The technical contact for this Sentry installation."
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="system.admin-email"
+                    label="Admin Email"
+                    name="system.admin-email"
+                    placeholder="admin@example.com"
+                    required={true}
+                  >
+                    <div
+                      className="control-group required"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                          htmlFor="id-system.admin-email"
+                        >
+                          Admin Email
+                        </label>
+                        <input
+                          className="form-control"
+                          disabled={false}
+                          id="id-system.admin-email"
+                          name="system.admin-email"
+                          onChange={[Function]}
+                          placeholder="admin@example.com"
+                          required={true}
+                          type="email"
+                          value=""
+                        />
+                        <p
+                          className="help-block"
+                        >
+                          The technical contact for this Sentry installation.
+                        </p>
+                      </div>
+                    </div>
+                  </EmailField>
+                </fieldset>
+                <fieldset
+                  key="mail"
+                >
+                  <legend>
+                    Outbound email
+                  </legend>
+                  <EmailField
+                    allowEmpty={false}
+                    component={[Function]}
+                    default="root@localhost"
+                    defaultValue="sentry@"
+                    disabled={false}
+                    disabledReason={null}
+                    help="Email address to be used in From for all outbound email."
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="mail.from"
+                    label="Email From"
+                    name="mail.from"
+                    required={true}
+                  >
+                    <div
+                      className="control-group required"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                          htmlFor="id-mail.from"
+                        >
+                          Email From
+                        </label>
+                        <input
+                          className="form-control"
+                          disabled={false}
+                          id="id-mail.from"
+                          name="mail.from"
+                          onChange={[Function]}
+                          required={true}
+                          type="email"
+                          value="sentry@"
+                        />
+                        <p
+                          className="help-block"
+                        >
+                          Email address to be used in From for all outbound email.
+                        </p>
+                      </div>
+                    </div>
+                  </EmailField>
+                  <TextField
+                    allowEmpty={false}
+                    default="localhost"
+                    defaultValue="localhost"
+                    disabled={false}
+                    disabledReason={null}
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="mail.host"
+                    label="SMTP Host"
+                    name="mail.host"
+                    placeholder="localhost"
+                    required={true}
+                  >
+                    <div
+                      className="control-group required"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                          htmlFor="id-mail.host"
+                        >
+                          SMTP Host
+                        </label>
+                        <input
+                          className="form-control"
+                          disabled={false}
+                          id="id-mail.host"
+                          name="mail.host"
+                          onChange={[Function]}
+                          placeholder="localhost"
+                          required={true}
+                          type="text"
+                          value="localhost"
+                        />
+                      </div>
+                    </div>
+                  </TextField>
+                  <TextField
+                    allowEmpty={false}
+                    default={25}
+                    defaultValue="25"
+                    disabled={false}
+                    disabledReason={null}
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="mail.port"
+                    label="SMTP Port"
+                    name="mail.port"
+                    placeholder="25"
+                    required={true}
+                  >
+                    <div
+                      className="control-group required"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                          htmlFor="id-mail.port"
+                        >
+                          SMTP Port
+                        </label>
+                        <input
+                          className="form-control"
+                          disabled={false}
+                          id="id-mail.port"
+                          name="mail.port"
+                          onChange={[Function]}
+                          placeholder="25"
+                          required={true}
+                          type="text"
+                          value="25"
+                        />
+                      </div>
+                    </div>
+                  </TextField>
+                  <TextField
+                    allowEmpty={true}
+                    default=""
+                    defaultValue=""
+                    disabled={false}
+                    disabledReason={null}
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="mail.username"
+                    label="SMTP Username"
+                    name="mail.username"
+                    required={false}
+                  >
+                    <div
+                      className="control-group"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                          htmlFor="id-mail.username"
+                        >
+                          SMTP Username
+                        </label>
+                        <input
+                          className="form-control"
+                          disabled={false}
+                          id="id-mail.username"
+                          name="mail.username"
+                          onChange={[Function]}
+                          required={false}
+                          type="text"
+                          value=""
+                        />
+                      </div>
+                    </div>
+                  </TextField>
+                  <TextField
+                    allowEmpty={true}
+                    default=""
+                    defaultValue=""
+                    disabled={false}
+                    disabledReason={null}
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="mail.password"
+                    label="SMTP Password"
+                    name="mail.password"
+                    required={false}
+                  >
+                    <div
+                      className="control-group"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                          htmlFor="id-mail.password"
+                        >
+                          SMTP Password
+                        </label>
+                        <input
+                          className="form-control"
+                          disabled={false}
+                          id="id-mail.password"
+                          name="mail.password"
+                          onChange={[Function]}
+                          required={false}
+                          type="text"
+                          value=""
+                        />
+                      </div>
+                    </div>
+                  </TextField>
+                  <BooleanField
+                    allowEmpty={true}
+                    component={[Function]}
+                    default={false}
+                    defaultValue={false}
+                    disabled={false}
+                    disabledReason={null}
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="mail.use-tls"
+                    label="Use TLS?"
+                    name="mail.use-tls"
+                    required={false}
+                  >
+                    <div
+                      className="control-group checkbox"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                        >
+                          <input
+                            checked={false}
+                            disabled={false}
+                            id="id-mail.use-tls"
+                            onChange={[Function]}
+                            type="checkbox"
+                          />
+                          Use TLS?
+                        </label>
+                      </div>
+                    </div>
+                  </BooleanField>
+                </fieldset>
+                <fieldset
+                  key="auth"
+                >
+                  <legend>
+                    Authentication
+                  </legend>
+                  <BooleanField
+                    allowEmpty={true}
+                    component={[Function]}
+                    default={false}
+                    defaultValue={false}
+                    disabled={false}
+                    disabledReason={null}
+                    help="Allow anyone to create an account and access this Sentry installation."
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="auth.allow-registration"
+                    label="Allow Registration"
+                    name="auth.allow-registration"
+                    required={false}
+                  >
+                    <div
+                      className="control-group checkbox"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                        >
+                          <input
+                            checked={false}
+                            disabled={false}
+                            id="id-auth.allow-registration"
+                            onChange={[Function]}
+                            type="checkbox"
+                          />
+                          Allow Registration
+                        </label>
+                        <p
+                          className="help-block"
+                        >
+                          Allow anyone to create an account and access this Sentry installation.
+                        </p>
+                      </div>
+                    </div>
+                  </BooleanField>
+                </fieldset>
+                <fieldset
+                  key="beacon"
+                >
+                  <legend>
+                    Beacon
+                  </legend>
+                  <RadioBooleanField
+                    allowEmpty={true}
+                    component={[Function]}
+                    default={false}
+                    disabled={false}
+                    disabledReason={null}
+                    help={
+                      <span>
+                        <span>
+                          If enabled, any stats reported to sentry.io will exclude identifying information (such as your administrative email address). By anonymizing your installation the Sentry team will be unable to contact you about security updates. For more information on what data is sent to Sentry, see the 
+                        </span>
+                        <a
+                          href="https://docs.sentry.io/server/beacon/"
+                        >
+                          <span>
+                            documentation
+                          </span>
+                        </a>
+                        <span>
+                          .
+                        </span>
+                      </span>
+                    }
+                    hideErrorMessage={false}
+                    isSet={true}
+                    key="beacon.anonymous"
+                    label="Usage Statistics"
+                    name="beacon.anonymous"
+                    noLabel="Send my contact information along with usage statistics"
+                    required={false}
+                    yesFirst={false}
+                    yesLabel="Please keep my usage information anonymous"
+                  >
+                    <div
+                      className="control-group"
+                    >
+                      <div
+                        className="controls"
+                      >
+                        <label
+                          className="control-label"
+                          htmlFor="id-beacon.anonymous"
+                        >
+                          Usage Statistics
+                        </label>
+                        <p
+                          className="help-block"
+                        >
+                          <span
+                            key="5"
+                          >
+                            <span
+                              key="0"
+                            >
+                              If enabled, any stats reported to sentry.io will exclude identifying information (such as your administrative email address). By anonymizing your installation the Sentry team will be unable to contact you about security updates. For more information on what data is sent to Sentry, see the 
+                            </span>
+                            <a
+                              href="https://docs.sentry.io/server/beacon/"
+                              key="2"
+                            >
+                              <span
+                                key="1"
+                              >
+                                documentation
+                              </span>
+                            </a>
+                            <span
+                              key="3"
+                            >
+                              .
+                            </span>
+                          </span>
+                        </p>
+                        <div
+                          className="control-group radio-boolean"
+                        >
+                          <div
+                            className="radio"
+                            key="no"
+                          >
+                            <label
+                              style={
+                                Object {
+                                  "fontWeight": "normal",
+                                }
+                              }
+                            >
+                              <input
+                                checked={false}
+                                disabled={false}
+                                name="beacon.anonymous"
+                                onChange={[Function]}
+                                type="radio"
+                                value="false"
+                              />
+                               
+                              Send my contact information along with usage statistics
+                            </label>
+                          </div>
+                          <div
+                            className="radio"
+                            key="yes"
+                          >
+                            <label
+                              style={
+                                Object {
+                                  "fontWeight": "normal",
+                                }
+                              }
+                            >
+                              <input
+                                checked={false}
+                                disabled={false}
+                                name="beacon.anonymous"
+                                onChange={[Function]}
+                                type="radio"
+                                value="true"
+                              />
+                               
+                              Please keep my usage information anonymous
+                            </label>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </RadioBooleanField>
+                </fieldset>
+                <div
+                  className="form-actions align-right"
+                  style={
+                    Object {
+                      "marginTop": 25,
+                    }
+                  }
+                >
+                  <button
+                    className="btn btn-primary"
+                    disabled={false}
+                    type="submit"
+                  >
+                    Continue
+                  </button>
+                </div>
+              </form>
+            </StyledForm>
+          </ApiForm>
+        </div>
+      </div>
+    </DocumentTitle>
+  </SideEffect(DocumentTitle)>
+</InstallWizard>
+`;

tests/js/spec/views/installWizard.spec.jsx

@@ -0,0 +1,89 @@
+import React from 'react';
+import {mount} from 'enzyme';
+
+import ConfigStore from 'app/stores/configStore';
+import InstallWizard from 'app/views/installWizard';
+
+jest.mock('app/stores/configStore', () => ({
+  get: jest.fn(),
+}));
+
+describe('InstallWizard', function() {
+  beforeAll(function() {
+    ConfigStore.get.mockImplementation(key => {
+      if (key === 'version') {
+        return {
+          current: '1.33.7',
+        };
+      }
+      return {};
+    });
+    MockApiClient.addMockResponse({
+      url: '/internal/options/?query=is:required',
+      body: TestStubs.InstallWizard(),
+    });
+  });
+
+  beforeEach(function() {});
+
+  it('renders', function() {
+    const wrapper = mount(<InstallWizard onConfigured={jest.fn()} />);
+    expect(wrapper).toMatchSnapshot();
+  });
+
+  it('has "Send my contact information..." when beacon.anonymous is false', function() {
+    MockApiClient.addMockResponse({
+      url: '/internal/options/?query=is:required',
+      body: TestStubs.InstallWizard({
+        'beacon.anonymous': {
+          field: {
+            disabledReason: null,
+            default: false,
+            required: true,
+            disabled: false,
+            allowEmpty: true,
+            isSet: false,
+          },
+          value: false,
+        },
+      }),
+    });
+    const wrapper = mount(<InstallWizard onConfigured={jest.fn()} />);
+
+    expect(
+      wrapper.find('input[name="beacon.anonymous"][value="false"]').prop('checked')
+    ).toBe(true);
+
+    expect(
+      wrapper.find('input[name="beacon.anonymous"][value="true"]').prop('checked')
+    ).toBe(false);
+  });
+
+  it('has "Please keep my usage anonymous" when beacon.anonymous is true', function() {
+    MockApiClient.addMockResponse({
+      url: '/internal/options/?query=is:required',
+      body: TestStubs.InstallWizard({
+        'beacon.anonymous': {
+          field: {
+            disabledReason: null,
+            default: false,
+            required: true,
+            disabled: false,
+            allowEmpty: true,
+            isSet: false,
+          },
+          value: true,
+        },
+      }),
+    });
+    const wrapper = mount(<InstallWizard onConfigured={jest.fn()} />);
+
+    expect(
+      wrapper.find('input[name="beacon.anonymous"][value="false"]').prop('checked')
+    ).toBe(false);
+
+    expect(
+      wrapper.find('input[name="beacon.anonymous"][value="true"]').prop('checked')
+    ).toBe(true);
+  });
+});