iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 15
2
Modern Web

Vue 怎麼寫測試系列 第 15

Day 15. 實作一個 reddit - 偵測文章內容

  • 分享至 

  • xImage
  •  

今天來點輕鬆的,我們幫文章實作一些細節

如果文章內容是圖片連結的話,轉換成圖片

it('內容如果是圖片連結,要顯示圖片', () => {
    let showButton = '.post:nth-child(2) .show-btn'
    let postContent = '.post:nth-child(2) .content'

    click( showButton )
    picture(posts[1].content, `${postContent} img`)
})
<p v-if="post.content && post.show" class="mt-2 content">
    <img class="img-fluid" v-if="isImage(post.content)" :src="post.content">
    <span v-else v-text="post.content"></span>
</p>

methods: {
    ...
    isImage: function (content) {
        return content.match(/\.(jpeg|jpg|gif|png)$/) != null
    }
},

上一篇
Day 14. 實作一個 reddit - 快速查看文章
下一篇
Day 16. 實作一個 reddit - 推文
系列文
Vue 怎麼寫測試30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言