Add first system testcase

Author: codergeek121

Gemfile

@@ -4,9 +4,14 @@ git_source(:github) { |repo| "https://github.com/#{repo}.git" }
 # Specify your gem's dependencies in custom_elements-rails.gemspec.
 gemspec
 
+gem "importmap-rails"
+gem "propshaft"
+
 gem "puma"
 
 gem "sqlite3", "~> 1.4"
 
 # Start debugger with binding.b [https://github.com/ruby/debug]
 # gem "debug", ">= 1.0.0"
+gem "capybara"
+gem "selenium-webdriver"

Gemfile.lock

@@ -81,13 +81,24 @@ GEM
       minitest (>= 5.1)
       mutex_m
       tzinfo (~> 2.0)
+    addressable (2.8.6)
+      public_suffix (>= 2.0.2, < 6.0)
     appraisal (2.5.0)
       bundler
       rake
       thor (>= 0.14.0)
     base64 (0.2.0)
     bigdecimal (3.1.7)
     builder (3.2.4)
+    capybara (3.40.0)
+      addressable
+      matrix
+      mini_mime (>= 0.1.3)
+      nokogiri (~> 1.11)
+      rack (>= 1.6.0)
+      rack-test (>= 0.6.3)
+      regexp_parser (>= 1.5, < 3.0)
+      xpath (~> 3.2)
     concurrent-ruby (1.2.3)
     connection_pool (2.4.1)
     crass (1.0.6)
@@ -98,6 +109,10 @@ GEM
       activesupport (>= 6.1)
     i18n (1.14.4)
       concurrent-ruby (~> 1.0)
+    importmap-rails (2.0.1)
+      actionpack (>= 6.0.0)
+      activesupport (>= 6.0.0)
+      railties (>= 6.0.0)
     io-console (0.7.2)
     irb (1.12.0)
       rdoc
@@ -111,6 +126,7 @@ GEM
       net-pop
       net-smtp
     marcel (1.0.4)
+    matrix (0.4.2)
     mini_mime (1.1.5)
     minitest (5.22.3)
     mutex_m (0.2.0)
@@ -128,8 +144,14 @@ GEM
       racc (~> 1.4)
     nokogiri (1.16.4-x86_64-linux)
       racc (~> 1.4)
+    propshaft (0.8.0)
+      actionpack (>= 7.0.0)
+      activesupport (>= 7.0.0)
+      rack
+      railties (>= 7.0.0)
     psych (5.1.2)
       stringio
+    public_suffix (5.0.5)
     puma (6.4.2)
       nio4r (~> 2.0)
     racc (1.7.3)
@@ -173,8 +195,16 @@ GEM
     rake (13.2.1)
     rdoc (6.6.3.1)
       psych (>= 4.0.0)
+    regexp_parser (2.9.0)
     reline (0.5.1)
       io-console (~> 0.5)
+    rexml (3.2.6)
+    rubyzip (2.3.2)
+    selenium-webdriver (4.19.0)
+      base64 (~> 0.2)
+      rexml (~> 3.2, >= 3.2.5)
+      rubyzip (>= 1.2.2, < 3.0)
+      websocket (~> 1.0)
     sqlite3 (1.7.3-arm64-darwin)
     sqlite3 (1.7.3-x86_64-linux)
     stringio (3.1.0)
@@ -183,9 +213,12 @@ GEM
     tzinfo (2.0.6)
       concurrent-ruby (~> 1.0)
     webrick (1.8.1)
+    websocket (1.2.10)
     websocket-driver (0.7.6)
       websocket-extensions (>= 0.1.0)
     websocket-extensions (0.1.5)
+    xpath (3.2.0)
+      nokogiri (~> 1.8)
     zeitwerk (2.6.13)
 
 PLATFORMS
@@ -194,8 +227,12 @@ PLATFORMS
 
 DEPENDENCIES
   appraisal
+  capybara
   custom_elements-rails!
+  importmap-rails
+  propshaft
   puma
+  selenium-webdriver
   sqlite3 (~> 1.4)
 
 BUNDLED WITH

test/custom_elements/integration_test.rb

@@ -0,0 +1,9 @@
+require "system_helper"
+
+class CustomElements::IntegrationTest < ApplicationSystemTestCase
+  test "it has a version number" do
+    visit elements_path
+
+    assert_text "connectedCallback(): hello_element.js"
+  end
+end

test/dummy/app/controllers/elements_controller.rb

@@ -0,0 +1,4 @@
+class ElementsController < ApplicationController
+  def show
+  end
+end

test/dummy/app/helpers/elements_helper.rb

@@ -0,0 +1,2 @@
+module ElementsHelper
+end

test/dummy/app/javascript/application.js

@@ -0,0 +1,2 @@
+// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
+import "custom_elements"

test/dummy/app/javascript/custom_elements/hello_element.js

@@ -0,0 +1,9 @@
+export default class extends HTMLElement {
+  constructor() {
+    super()
+  }
+
+  connectedCallback() {
+    this.textContent = "connectedCallback(): hello_element.js"
+  }
+}

test/dummy/app/javascript/custom_elements/index.js

@@ -0,0 +1,3 @@
+import { eagerDefineCustomElementsFrom } from "custom_elements-rails"
+
+eagerDefineCustomElementsFrom("custom_elements", { prefix: "app" })

test/dummy/app/views/elements/show.html.erb

@@ -0,0 +1,3 @@
+<h1>Elements#show</h1>
+
+<app-hello></app-hello>

test/dummy/app/views/layouts/application.html.erb

@@ -7,6 +7,7 @@
     <%= csp_meta_tag %>
 
     <%= stylesheet_link_tag "application" %>
+    <%= javascript_importmap_tags %>
   </head>
 
   <body>

test/dummy/bin/importmap

@@ -0,0 +1,4 @@
+#!/usr/bin/env ruby
+
+require_relative "../config/application"
+require "importmap/commands"

test/dummy/config/importmap.rb

@@ -0,0 +1,3 @@
+pin "application"
+pin "custom_elements-rails"
+pin_all_from "app/javascript/custom_elements", under: "custom_elements"

test/dummy/config/routes.rb

@@ -1,10 +1,3 @@
 Rails.application.routes.draw do
-  # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html
-
-  # Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500.
-  # Can be used by load balancers and uptime monitors to verify that the app is live.
-  get "up" => "rails/health#show", as: :rails_health_check
-
-  # Defines the root path route ("/")
-  # root "posts#index"
+  resource :elements
 end

test/dummy/test/controllers/elements_controller_test.rb

@@ -0,0 +1,8 @@
+require "test_helper"
+
+class ElementsControllerTest < ActionDispatch::IntegrationTest
+  test "should get show" do
+    get elements_show_url
+    assert_response :success
+  end
+end

test/dummy/vendor/javascript/.keep

@@ -0,0 +1,7 @@
+require "test_helper"
+
+Capybara.server = :puma, { Silent: true }
+
+class ApplicationSystemTestCase < ActionDispatch::SystemTestCase
+  driven_by :selenium, using: :headless_chrome, screen_size: [1400, 1400]
+end