Merge pull request #233 from mayanktap/add-iframe-tag

Add iframe component.

Author: pascalwengerter

app/concepts/matestack/ui/core/iframe/iframe.haml

@@ -0,0 +1,5 @@
+%iframe{@tag_attributes}
+  - if options[:text].nil? && block_given?
+    = yield
+  - else
+    = options[:text]

app/concepts/matestack/ui/core/iframe/iframe.rb

@@ -0,0 +1,14 @@
+module Matestack::Ui::Core::Iframe
+  class Iframe < Matestack::Ui::Core::Component::Static
+
+    def setup
+      @tag_attributes.merge!({
+        src: options[:src],
+        height: options[:height],
+        width: options[:width],
+        srcdoc: options[:srcdoc]
+      })
+    end
+
+  end
+end

docs/components/iframe.md

@@ -0,0 +1,58 @@
+# matestack core component: Iframe
+
+Show [specs](/spec/usage/components/iframe_spec.rb)
+
+The HTML iframe tag implemented in ruby.
+
+## Parameters
+
+This component can take 3 configuration params and either yield content or display what gets passed to the `text` configuration param.
+
+#### # id (optional)
+Expects a string with all ids the `iframe` should have.
+
+#### # class (optional)
+Expects a string with all classes the `iframe` should have for styling purpose.
+
+#### # height (optional)
+Specifies the height of an `iframe`.
+
+#### # width (optional)
+Specifies the width of an `iframe`.
+
+#### # src
+Specifies the address of the document to embed in the `iframe` tag.
+
+#### # srcdoc
+Specifies the HTML content of the page to show in the inline frame.
+
+## Example 1: Yield a given block
+
+```ruby
+iframe id: "foo", class: "bar", src="https://www.demopage.com" do
+  plain 'The browser does not support iframe.'
+end
+```
+
+returns
+
+```html
+<iframe id="foo" class="bar" src="https://www.demopage.com">
+  The browser does not support iframe.
+</iframe>
+```
+
+## Example 2: Render options[:text] param
+
+```ruby
+iframe id: "foo", class: "bar", src="https://www.demopage.com", text: 'The browser does not support iframe.'
+```
+
+returns
+
+```html
+<iframe id="foo" class="bar" src="https://www.demopage.com">
+  The browser does not support iframe.
+</iframe>
+```
+

spec/usage/components/iframe_spec.rb

@@ -0,0 +1,65 @@
+require_relative "../../support/utils"
+include Utils
+
+describe 'Iframe Component', type: :feature, js: true do
+
+  it 'Example 1 - yield, no options[:text]' do
+
+    class ExamplePage < Matestack::Ui::Page
+
+      def response
+        components {
+          # simple iframe tag
+          iframe src="https://www.demopage.com" do
+            plain 'The browser does not support iframe.'
+          end
+
+          # enhanced iframe tag
+          iframe id: 'my-id', class: 'my-class', src="https://www.demopage.com", srcdoc="<p>Mate Stack UI!</p>" do
+            plain 'The browser does not support iframe.'
+          end
+        }
+      end
+
+    end
+
+    visit '/example'
+    static_output = page.html
+
+    expected_static_output = <<~HTML
+    <iframe src="https://www.demopage.com">The browser does not support iframe.</iframe>
+    <iframe id="my-id" class="my-class" src="https://www.demopage.com" srcdoc="<p>Mate Stack UI!</p>">The browser does not support iframe.</iframe>
+    HTML
+    expect(stripped(static_output)).to include(stripped(expected_static_output))
+  end
+
+  it 'Example 2 - render options[:text]' do
+
+    class ExamplePage < Matestack::Ui::Page
+
+      def response
+        components {
+          # simple iframe tag
+          iframe src="https://www.demopage.com", text: 'The browser does not support iframe.'
+
+          # enhanced iframe tag
+          iframe id: 'my-id', class: 'my-class', src="https://www.demopage.com",
+            srcdoc="<p>Mate Stack UI!</p>", text: 'The browser does not support iframe.'
+        }
+      end
+
+    end
+
+    visit '/example'
+
+    static_output = page.html
+
+    expected_static_output = <<~HTML
+    <iframe src="https://www.demopage.com">The browser does not support iframe.</iframe>
+    <iframe id="my-id" class="my-class" src="https://www.demopage.com" srcdoc="<p>Mate Stack UI!</p>">The browser does not support iframe.</iframe>
+    HTML
+
+    expect(stripped(static_output)).to include(stripped(expected_static_output))
+  end
+
+end