Release: Fix widget modal button initialization and other improvements

[rileyseaburg]

Summary

This release includes fixes for the Touchpoints widget not displaying correctly, along with several infrastructure improvements.

Key Changes

• Fix Rust widget renderer modal button initialization (Fix Rust widget renderer modal button initialization #1924)

  • Fixed the issue where the toast/feedback button was not opening the modal when clicked
  • Added proper USWDS Modal initialization for the #fba-button element
  • Fixed modal class prefix to respect load_css setting
  • Added CSS backtick escaping to prevent JavaScript syntax errors
  • Removed expired certificate file and added *.pem to .gitignore

• Fix production manifest for rust buildpack (Fix production manifest buildpack + disk quota #1918)

• Fix User#cx_collections specs (Fix User#cx_collections specs #1915)

• Fix widget renderer load when native lib missing (Fix WidgetRenderer load when native lib missing #1913)

• Fix cx_collections export_csv 500 error

• Add Cargo caching and library linkage verification to CircleCI

Testing

• All CI tests passing
• Widget modal functionality verified to work correctly

Fixes Zendesk ticket #37620

[Copilot]

Pull request overview

This PR fixes critical issues with the Touchpoints widget modal button initialization and includes several infrastructure improvements. The main fix ensures that the toast/feedback button properly opens the modal when clicked by adding correct USWDS Modal initialization. Additional improvements include deployment configuration updates, database index optimizations, test fixes, and enhanced error handling for the Rust widget renderer.

Key Changes:

• Fixed Rust widget renderer modal button initialization by properly initializing USWDS Modal for all button types
• Added CSS backtick escaping to prevent JavaScript syntax errors in widget rendering
• Improved deployment scripts with pre-deployment migrations, better error handling, and Login.gov environment variable synchronization
• Added database indexes on cx_collections tables to improve query performance
• Enhanced widget renderer loading logic to skip initialization during rake tasks and migrations

Reviewed changes

Copilot reviewed 30 out of 33 changed files in this pull request and generated 7 comments.

Show a summary per file

File	Description
ext/widget_renderer/src/template_renderer.rs	Adds USWDS Modal initialization for fba-button and custom buttons, fixes modal class prefix logic to respect load_css setting, adds CSS escaping for JavaScript strings
ext/widget_renderer/src/form_data.rs	Adds css field to FormData struct with default value
ext/widget_renderer/lib/widget_renderer.rb	Updates library search paths to prioritize workspace target directory, improves error handling with LoadError exceptions
ext/widget_renderer/extconf.rb	Adds cargo clean step before build and redirects stderr to stdout
ext/widget_renderer/widget_renderer.gemspec	Updates version to 0.1.3 and adds BUILD_ID to packaged files
ext/widget_renderer/BUILD_ID	Adds new build identifier file
ext/widget_renderer/Cargo.toml	Bumps version to 0.1.1
app/models/form.rb	Adds render_widget_css method to provide CSS content to Rust renderer
app/models/user.rb	Fixes cx_collections method to return empty collection when user has no organization
app/models/cx_collection.rb	Optimizes to_csv query with proper includes and removes syntax error in csv generation
config/initializers/widget_renderer.rb	Adds logic to skip loading during rake tasks and migrations, improves error handling
config/routes.rb	Adds default value '/admin' for INDEX_URL environment variable
config/environments/production.rb	Enables static file serving when RAILS_SERVE_STATIC_FILES is set
config/environments/development.rb	Enables static file serving when RAILS_SERVE_STATIC_FILES is set
db/migrate/20251210192727_add_indexes_to_cx_collections.rb	Adds missing foreign key indexes to cx_collections, cx_collection_details, and cx_responses tables
db/schema.rb	Updates schema version and adds new indexes
touchpoints.yml	Updates Redis service name, adds timeout and disk quota, improves secret management with comments, adds Rust buildpack URL
touchpoints-staging.yml	Changes command to run db:schema:load and db:seed with corrected syntax, adds timeout
touchpoints-demo.yml	Adds timeout and Rust buildpack URL
spec/requests/rack_attack_spec.rb	Adds form factory and valid params to fix failing tests
spec/models/user_spec.rb	Adds comprehensive specs for cx_collections method with organization hierarchy testing
spec/mailers/user_mailer_spec.rb	Refactors to use time_threshold variable to avoid timing issues in tests
spec/features/admin/forms_spec.rb	Adds sleep and increased wait time to handle stale element errors
.circleci/config.yml	Adds Cargo caching, library linkage verification, and updates comments about prebuilt library
.circleci/deploy.sh	Adds run_migrations function, manifest path parameter, Login.gov env sync, increased timeout
.circleci/deploy-sidekiq.sh	Updates deployment strategy with app stop/start, health check updates, and Login.gov env sync
.circleci/sync-login-gov-env.sh	Adds new script to synchronize Login.gov environment variables
.profile.d/build_widget_renderer.sh	Simplifies to copy pre-built library instead of building at runtime
.gitignore	Adds *.pem pattern to ignore certificate files
.cfignore	Removes exclusions for keeping prebuilt Rust library in target directories
Gemfile.lock	Updates widget_renderer version to 0.1.3
Cargo.toml	Adds workspace.package configuration
Cargo.lock	Updates widget_renderer version to 0.1.1

Comments suppressed due to low confidence (2)

ext/widget_renderer/src/template_renderer.rs:911

• The modal_button_text (line 905), success_heading (line 910), and success_text (line 911) values are inserted directly into the JavaScript string without escaping. If these values contain quotes, backslashes, or newlines, they could break the JavaScript syntax or cause XSS vulnerabilities. These should be escaped similar to how CSS is escaped in lines 871-876.

            button_text = form.modal_button_text,
            selector = form.element_selector,
            css = escaped_css,
            delivery_method = form.delivery_method,
            load_css = form.load_css,
            success_heading = form.success_text_heading,
            success_text = form.success_text,

app/models/cx_collection.rb:146

• The query eager loads 'cx_collection_details' on line 91 to optimize the N+1 query issue, but then line 146 calls '.size' which will still count the loaded associations. However, the code could instead use 'cx_collection_details.count' from the counter_cache or directly access the loaded size. Since the associations are already loaded, '.size' should work efficiently. Consider verifying this is using the preloaded data and not triggering additional queries.

      .includes(:organization, :service, :user, :cx_collection_details, service_provider: :organization)
      .references(:organization)
      .order(:fiscal_year, :quarter, 'organizations.name')

    attributes = %i[
      id
      name
      organization_id
      organization_name
      organization_abbreviation
      service_provider_id
      service_provider_name
      service_provider_organization_id
      service_provider_organization_name
      service_provider_organization_abbreviation
      service_id
      service_name
      user_email
      fiscal_year
      quarter
      created_at
      updated_at
      submitted_at
      rating
      aasm_state
      integrity_hash
      cx_collection_details_count
    ]

    CSV.generate(headers: true) do |csv|
      csv << attributes

      collections.each do |collection|
        csv << [
          collection.id,
          collection.name,
          collection.organization_id,
          collection.organization&.name,
          collection.organization&.abbreviation,
          collection.service_provider_id,
          collection.service_provider&.name,
          collection.service_provider&.organization_id,
          collection.service_provider&.organization&.name,
          collection.service_provider&.organization&.abbreviation,
          collection.service_id,
          collection.service&.name,
          collection.user&.email,
          collection.fiscal_year,
          collection.quarter,
          collection.created_at,
          collection.updated_at,
          collection.submitted_at,
          collection.rating,
          collection.aasm_state,
          collection.integrity_hash,
          collection.cx_collection_details.size,

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The element_selector value is inserted directly into getElementById without escaping (line 968), which could lead to JavaScript syntax errors if the selector contains special characters like quotes or backslashes. The selector should be escaped similar to how CSS is escaped in lines 871-876.

Suggested change

	const customButtonEl = document.getElementById('{element_selector}');
	const customButtonEl = (window.CSS && typeof CSS.escape === 'function')
	? document.querySelector('#' + CSS.escape('{element_selector}'))
	: document.getElementById('{element_selector}');

[Copilot]

Using 'sleep 0.5' to wait for form updates is a brittle approach that can lead to flaky tests. Instead, use Capybara's built-in waiting mechanisms like 'expect(page).to have_content' or explicit wait conditions that verify the actual state change. This will make the test more reliable and faster.

[Copilot]

The production deployment (line 223) passes 'false' for the 'run_migrations' parameter, while demo and staging deployments (lines 235, 247) pass 'true'. This means migrations are not automatically run for production deployments, which could lead to schema mismatches after deployment. Production should either run migrations or have a clear documented process for running them separately.

Suggested change

	cf_push_with_retry touchpoints touchpoints.yml false
	cf_push_with_retry touchpoints touchpoints.yml true

[Copilot]

The deploy script stops the Sidekiq app (line 126) before pushing, which causes downtime for background job processing. This means jobs will not be processed during the deployment window. For a worker process like Sidekiq, a better approach would be to allow the old instance to finish current jobs gracefully before replacing it, or ensure the deployment window is communicated to users.

Suggested change

	# Stop the app first to free memory for staging
	echo "Stopping $app_name to free memory for staging..."
	cf stop "$app_name" || true
	sleep 5
	# Push without rolling strategy (direct replacement since we stopped it)
	# Let CF auto-detect buildpacks to avoid re-running supply phase (Rust already built in CircleCI)
	if cf push "$app_name" \
	-t 180 \
	# Do not stop the app to avoid downtime for Sidekiq background jobs.
	# Keep a single instance running and rely on a rolling deploy to replace it gracefully.
	# Push with rolling strategy (zero-downtime replacement of the running worker instance)
	# Let CF auto-detect buildpacks to avoid re-running supply phase (Rust already built in CircleCI)
	if cf push "$app_name" \
	-t 180 \
	--strategy rolling \

[Copilot]

The command runs two rake tasks sequentially using '&&' which means both will execute. However, the syntax 'rake cf:on_first_instance db:schema:load db:seed' will pass both 'db:schema:load' and 'db:seed' as arguments to the first task, not execute them as separate tasks. This should be 'rake cf:on_first_instance && rake db:schema:load && rake db:seed' or 'rake cf:on_first_instance db:schema:load && rake db:seed' to properly execute each task.

[Copilot]

The code for setting up the mock request is duplicated between 'render_touchpoints_js_string' (lines 361-382) and 'render_widget_css' (lines 386-406). This duplication should be extracted into a private helper method to improve maintainability and reduce the risk of inconsistencies.

[Copilot]

Running 'cargo clean' before every build (line 34) removes cached artifacts, significantly increasing build time. Since the build is running in a clean CI environment or during gem installation, the clean step is unnecessary and should be removed to improve build performance.

Suggested change

	puts "Cleaning previous build artifacts..."
	system("#{cargo_bin} clean 2>&1")

[rileyseaburg]

Verification of Current Production State

I checked the widget JS currently served from production (https://touchpoints.app.cloud.gov/touchpoints/92b47c29.js) and confirmed the issue:

Current Production Code (Missing Fix)

The USWDS initialization at the end of the widget script only initializes:

• fbaUswds.ComboBox.on(fbaFormElement)
• fbaUswds.DatePicker.on(fbaFormElement)
• fbaUswds.Modal.on(fbaModalElement)

Missing: Initialization for #fba-button element

After This Release

The fix adds the missing button initialization:

const fbaButton = document.querySelector('#fba-button');
if (fbaButton) {
    if (fbaUswds.Modal) {
        fbaUswds.Modal.on(fbaButton);
        fbaButton.classList.add('fba-initialized');
    }
}

This will allow the USWDS Modal library to properly handle click events on the feedback button, enabling the modal to open when users click the toast button.

Testing Recommendation

After merge and deployment, verify on https://touchpoints.digital.gov that:

1. The "How can we improve Touchpoints?" button appears in the bottom right corner
2. Clicking the button opens the modal dialog
3. The modal can be closed and reopened correctly