diff --git a/src/components/BookingPanel/BookingPanel.js b/src/components/BookingPanel/BookingPanel.js
index 14fc5f06..2de05a3e 100644
--- a/src/components/BookingPanel/BookingPanel.js
+++ b/src/components/BookingPanel/BookingPanel.js
@@ -118,6 +118,7 @@ const BookingPanel = props => {
         {showBookingDatesForm ? (
           <BookingDatesForm
             className={css.bookingForm}
+            formId="BookingPanel"
             submitButtonWrapperClassName={css.bookingDatesSubmitButtonWrapper}
             unitType={unitType}
             onSubmit={onSubmit}
diff --git a/src/components/FieldDateRangeInput/FieldDateRangeInput.example.js b/src/components/FieldDateRangeInput/FieldDateRangeInput.example.js
index 5b5ec6f5..a77358fb 100644
--- a/src/components/FieldDateRangeInput/FieldDateRangeInput.example.js
+++ b/src/components/FieldDateRangeInput/FieldDateRangeInput.example.js
@@ -103,7 +103,7 @@ export const WithAvailableTimeSlotsNighlyBooking = {
       startDateId: 'WithAvailableTimeSlotsDateRangeNightly.bookingStartDate',
       startDateLabel: 'Start date',
       startDatePlaceholderText: moment().format('ddd, MMMM D'),
-      endDateId: 'WithAvailableTimeSlotsDateRangeInputForm.bookingEndDate',
+      endDateId: 'WithAvailableTimeSlotsDateRangeNightly.bookingEndDate',
       endDateLabel: 'End date',
       endDatePlaceholderText: moment()
         .add(1, 'days')
@@ -139,7 +139,7 @@ export const WithAvailableTimeSlotsDailyBooking = {
       startDateId: 'WithAvailableTimeSlotsDateRangeDaily.bookingStartDate',
       startDateLabel: 'Start date',
       startDatePlaceholderText: moment().format('ddd, MMMM D'),
-      endDateId: 'WithAvailableTimeSlotsDateRangeInputForm.bookingEndDate',
+      endDateId: 'WithAvailableTimeSlotsDateRangeDaily.bookingEndDate',
       endDateLabel: 'End date',
       endDatePlaceholderText: moment()
         .add(1, 'days')
diff --git a/src/forms/FilterForm/FilterForm.example.js b/src/forms/FilterForm/FilterForm.example.js
index 4dea9a08..8b79f28a 100644
--- a/src/forms/FilterForm/FilterForm.example.js
+++ b/src/forms/FilterForm/FilterForm.example.js
@@ -2,9 +2,9 @@ import React from 'react';
 import FilterForm from './FilterForm';
 import { FieldTextInput } from '../../components';
 
-const field = (
+const field = formId => (
   <FieldTextInput
-    id="field"
+    id={`${formId}.field`}
     name="field"
     type="textarea"
     label="Field label"
@@ -29,7 +29,7 @@ export const FilterFormExample = {
       console.log('onClear called');
     },
     label: 'Example label',
-    children: field,
+    children: field('FilterFormExample'),
   },
   group: 'forms',
 };
@@ -45,7 +45,7 @@ export const FilterFormExampleLiveEdit = {
       console.log(values);
     },
     label: 'Example label',
-    children: field,
+    children: field('FilterFormExampleLiveEdit'),
   },
   group: 'forms',
 };
diff --git a/src/forms/SendMessageForm/SendMessageForm.example.js b/src/forms/SendMessageForm/SendMessageForm.example.js
index dc978785..845dba77 100644
--- a/src/forms/SendMessageForm/SendMessageForm.example.js
+++ b/src/forms/SendMessageForm/SendMessageForm.example.js
@@ -3,6 +3,7 @@ import SendMessageForm from './SendMessageForm';
 export const Empty = {
   component: SendMessageForm,
   props: {
+    formId: 'SendMessageForm.Empty.Form',
     messagePlaceholder: 'Send message to Juho…',
     onChange: values => {
       console.log('values changed to:', values);
@@ -23,6 +24,7 @@ export const Empty = {
 export const InProgress = {
   component: SendMessageForm,
   props: {
+    formId: 'SendMessageForm.InProgress.Form',
     messagePlaceholder: 'Send message to Juho…',
     inProgress: true,
     onSubmit: values => {
@@ -35,6 +37,7 @@ export const InProgress = {
 export const Error = {
   component: SendMessageForm,
   props: {
+    formId: 'SendMessageForm.Error.Form',
     messagePlaceholder: 'Send message to Juho…',
     sendMessageError: { type: 'error', name: 'ExampleError' },
     onSubmit: values => {